perf: load Toast asynchronously (#851)

This commit is contained in:
Nolan Lawson 2018-12-22 15:37:51 -08:00 committed by GitHub
parent 59f9be448d
commit 4ab9687200
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
28 changed files with 52 additions and 44 deletions

View File

@ -43,7 +43,7 @@
<div id='sapper'>%sapper.html%</div>
<!-- Toast.html gets rendered here -->
<div id="toast"></div>
<div id="theToast"></div>
<!-- LoadingMask.html gets rendered here -->
<div id="loading-mask" aria-hidden="true"></div>

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { blockAccount, unblockAccount } from '../_api/block'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { updateLocalRelationship } from './accounts'
import { emit } from '../_utils/eventBus'

View File

@ -1,5 +1,5 @@
import { store } from '../_store/store'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { postStatus as postStatusToServer } from '../_api/statuses'
import { addStatusOrNotification } from './addStatusOrNotification'
import { database } from '../_database/database'

View File

@ -1,5 +1,5 @@
import { importShowCopyDialog } from '../_components/dialog/asyncDialogs'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
export async function copyText (text) {
if (navigator.clipboard) { // not supported in all browsers

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { deleteStatus } from '../_api/delete'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { deleteStatus as deleteStatusLocally } from './deleteStatuses'
export async function doDeleteStatus (statusId) {

View File

@ -1,6 +1,6 @@
import { favoriteStatus, unfavoriteStatus } from '../_api/favorite'
import { store } from '../_store/store'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { database } from '../_database/database'
export async function setFavorited (statusId, favorited) {

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { followAccount, unfollowAccount } from '../_api/follow'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { updateLocalRelationship } from './accounts'
export async function setAccountFollowed (accountId, follow, toastOnSuccess) {

View File

@ -1,7 +1,7 @@
import { getVerifyCredentials } from '../_api/user'
import { store } from '../_store/store'
import { switchToTheme } from '../_utils/themeEngine'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { goto } from '../../../__sapper__/client'
import { cacheFirstUpdateAfter } from '../_utils/sync'
import { getInstanceInfo } from '../_api/instance'

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { uploadMedia } from '../_api/media'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { scheduleIdleTask } from '../_utils/scheduleIdleTask'
export async function doMediaUpload (realm, file) {

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { muteAccount, unmuteAccount } from '../_api/mute'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { updateLocalRelationship } from './accounts'
import { emit } from '../_utils/eventBus'

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { muteConversation, unmuteConversation } from '../_api/muteConversation'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { database } from '../_database/database'
export async function setConversationMuted (statusId, mute, toastOnSuccess) {

View File

@ -1,5 +1,5 @@
import { store } from '../_store/store'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { pinStatus, unpinStatus } from '../_api/pin'
import { database } from '../_database/database'
import { emit } from '../_utils/eventBus'

View File

@ -1,5 +1,5 @@
import { store } from '../_store/store'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { reblogStatus, unreblogStatus } from '../_api/reblog'
import { database } from '../_database/database'

View File

@ -1,7 +1,7 @@
import { store } from '../_store/store'
import { approveFollowRequest, rejectFollowRequest } from '../_api/requests'
import { emit } from '../_utils/eventBus'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
export async function setFollowRequestApprovedOrRejected (accountId, approved, toastOnSuccess) {
let {

View File

@ -1,5 +1,5 @@
import { store } from '../_store/store'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { search } from '../_api/search'
export async function doSearch () {

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { blockDomain, unblockDomain } from '../_api/blockDomain'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { updateRelationship } from './accounts'
export async function setDomainBlocked (accountId, domain, block, toastOnSuccess) {

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { setShowReblogs as setShowReblogsApi } from '../_api/showReblogs'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { updateLocalRelationship } from './accounts'
export async function setShowReblogs (accountId, showReblogs, toastOnSuccess) {

View File

@ -1,6 +1,6 @@
import { store } from '../_store/store'
import { getTimeline } from '../_api/timelines'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import { mark, stop } from '../_utils/marks'
import { concat, mergeArrays } from '../_utils/arrays'
import { byItemIds } from '../_utils/sorting'

View File

@ -34,7 +34,7 @@
import { store } from '../_store/store'
import LoadingPage from './LoadingPage.html'
import AccountSearchResult from './search/AccountSearchResult.html'
import { toast } from '../_utils/toast'
import { toast } from './toast/toast'
import { on } from '../_utils/eventBus'
// TODO: paginate

View File

@ -29,7 +29,7 @@
import { show } from '../helpers/showDialog'
import { close } from '../helpers/closeDialog'
import { oncreate as onCreateDialog } from '../helpers/onCreateDialog'
import { toast } from '../../../_utils/toast'
import { toast } from '../../toast/toast'
import { doubleRAF } from '../../../_utils/doubleRAF'
export default {

View File

@ -39,7 +39,7 @@
import { importShowConfirmationDialog } from '../../dialog/asyncDialogs'
import { logOutOfInstance } from '../../../_actions/instances'
import { updatePushSubscriptionForInstance, updateAlerts } from '../../../_actions/pushSubscription'
import { toast } from '../../../_utils/toast'
import { toast } from '../../toast/toast'
export default {
async oncreate () {

View File

@ -0,0 +1,22 @@
import { importToast } from '../../_utils/asyncModules'
let toast
const lazyToast = {
async say (text) {
if (!toast) {
let Toast = await importToast()
if (!toast) {
toast = new Toast({
target: document.querySelector('#theToast')
})
if (process.env.NODE_ENV !== 'production') {
window.toast = toast // for debugging
}
}
}
toast.say(text)
}
}
export { lazyToast as toast }

View File

@ -31,7 +31,7 @@
import { store } from '../_store/store'
import LoadingPage from '../_components/LoadingPage.html'
import StatusSearchResult from '../_components/search/StatusSearchResult.html'
import { toast } from '../_utils/toast'
import { toast } from '../_components/toast/toast'
import DynamicPageBanner from '../_components/DynamicPageBanner.html'
import { getPinnedStatuses } from '../_api/pinnedStatuses'
import { updateVerifyCredentialsForInstance } from '../_actions/instances'

View File

@ -1,5 +1,5 @@
import debounce from 'lodash-es/debounce'
import { toast } from '../../_utils/toast'
import { toast } from '../../_components/toast/toast'
const OFFLINE_DELAY = 5000
const NOTIFY_OFFLINE_LIMIT = 1

View File

@ -39,3 +39,7 @@ export const importLoggedInObservers = () => import(
export const importEmojiMart = () => import(
/* webpackChunkName: 'createEmojiMartPickerFromData.js' */ '../_react/createEmojiMartPickerFromData.js'
).then(getDefault)
export const importToast = () => import(
/* webpackChunkName: 'Toast.html' */ '../_components/toast/Toast.html'
).then(getDefault)

View File

@ -1,4 +1,4 @@
import { toast } from './toast'
import { toast } from '../_components/toast/toast'
function onUpdateFound (registration) {
const newWorker = registration.installing

View File

@ -1,18 +0,0 @@
import Toast from '../_components/Toast.html'
let toast
if (process.browser) {
toast = new Toast({
target: document.querySelector('#toast')
})
if (process.env.NODE_ENV !== 'production') {
window.toast = toast // for debugging
}
} else {
toast = {
say: () => {}
}
}
export { toast }