perf: move async modules to individual files (#1611)

This commit is contained in:
Nolan Lawson 2019-10-29 18:58:49 -07:00 committed by GitHub
parent 4bc8036dd9
commit b8d9c29bac
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
60 changed files with 121 additions and 149 deletions

View file

@ -1,4 +1,4 @@
import { importShowCopyDialog } from '../_components/dialog/asyncDialogs'
import { importShowCopyDialog } from '../_components/dialog/asyncDialogs/importShowCopyDialog.js'
import { toast } from '../_components/toast/toast'
export async function copyText (text) {

View file

@ -1,5 +1,5 @@
import { statusHtmlToPlainText } from '../_utils/statusHtmlToPlainText'
import { importShowComposeDialog } from '../_components/dialog/asyncDialogs'
import { importShowComposeDialog } from '../_components/dialog/asyncDialogs/importShowComposeDialog.js'
import { doDeleteStatus } from './delete'
import { store } from '../_store/store'

View file

@ -6,7 +6,7 @@ import { goto } from '../../../__sapper__/client'
import { cacheFirstUpdateAfter } from '../_utils/sync'
import { getInstanceInfo } from '../_api/instance'
import { database } from '../_database/database'
import { importVirtualListStore } from '../_utils/asyncModules'
import { importVirtualListStore } from '../_utils/asyncModules/importVirtualListStore.js'
export function changeTheme (instanceName, newTheme) {
const { instanceThemes } = store.get()

View file

@ -1,4 +1,4 @@
import { importShowComposeDialog } from '../_components/dialog/asyncDialogs'
import { importShowComposeDialog } from '../_components/dialog/asyncDialogs/importShowComposeDialog.js'
import { store } from '../_store/store'
export async function composeNewStatusMentioning (account) {

View file

@ -1,4 +1,4 @@
import { importShowReportDialog } from '../_components/dialog/asyncDialogs'
import { importShowReportDialog } from '../_components/dialog/asyncDialogs/importShowReportDialog.js'
export async function reportStatusOrAccount ({ status, account }) {
const showReportDialog = await importShowReportDialog()

View file

@ -1,5 +1,5 @@
import { store } from '../_store/store'
import { importShowComposeDialog } from '../_components/dialog/asyncDialogs'
import { importShowComposeDialog } from '../_components/dialog/asyncDialogs/importShowComposeDialog.js'
export async function showShareDialogIfNecessary () {
const { isUserLoggedIn, openShareDialog } = store.get()

View file

@ -1,4 +1,4 @@
import { importShowMuteDialog } from '../_components/dialog/asyncDialogs'
import { importShowMuteDialog } from '../_components/dialog/asyncDialogs/importShowMuteDialog.js'
import { setAccountMuted } from './mute'
export async function toggleMute (account, mute) {

View file

@ -50,7 +50,7 @@
</style>
<script>
import NavItem from './NavItem'
import { importNavShortcuts } from '../_utils/asyncModules'
import { importNavShortcuts } from '../_utils/asyncModules/importNavShortcuts.js'
import { store } from '../_store/store'
export default {

View file

@ -19,7 +19,8 @@
<script>
import Shortcut from './shortcut/Shortcut'
import { goto } from '../../../__sapper__/client'
import { importShowShortcutHelpDialog, importShowComposeDialog } from './dialog/asyncDialogs'
import { importShowShortcutHelpDialog } from './dialog/asyncDialogs/importShowShortcutHelpDialog'
import { importShowComposeDialog } from './dialog/asyncDialogs/importShowComposeDialog'
import { store } from '../_store/store'
export default {

View file

@ -130,7 +130,7 @@
import { ONE_TRANSPARENT_PIXEL } from '../../_static/media'
import { get } from '../../_utils/lodash-lite'
import { coordsToPercent } from '../../_utils/coordsToPercent'
import { importShowMediaEditDialog } from '../dialog/asyncDialogs'
import { importShowMediaEditDialog } from '../dialog/asyncDialogs/importShowMediaEditDialog.js'
import { throttleTimer } from '../../_utils/throttleTimer'
const updateMediaInStore = throttleTimer(scheduleIdleTask)

View file

@ -31,7 +31,7 @@
<script>
import ComposeButton from './ComposeButton.html'
import { store } from '../../_store/store'
import { importShowComposeDialog } from '../dialog/asyncDialogs'
import { importShowComposeDialog } from '../dialog/asyncDialogs/importShowComposeDialog.js'
import { observe } from 'svelte-extras'
import { classname } from '../../_utils/classname'

View file

@ -70,7 +70,8 @@
<script>
import IconButton from '../IconButton.html'
import { store } from '../../_store/store'
import { importShowEmojiDialog, importShowPostPrivacyDialog } from '../dialog/asyncDialogs'
import { importShowEmojiDialog } from '../dialog/asyncDialogs/importShowEmojiDialog'
import { importShowPostPrivacyDialog } from '../dialog/asyncDialogs/importShowPostPrivacyDialog'
import { doMediaUpload } from '../../_actions/media'
import { toggleContentWarningShown } from '../../_actions/contentWarnings'
import { mediaAccept } from '../../_static/media'

View file

@ -2,7 +2,8 @@
<svelte:component this={composeBox} {realm} {hidden} />
{/if}
<script>
import { importComposeBox, importLoggedInStoreExtensions } from '../../_utils/asyncModules'
import { importComposeBox } from '../../_utils/asyncModules/importComposeBox'
import { importLoggedInStoreExtensions } from '../../_utils/asyncModules/importLoggedInStoreExtensions'
export default {
async oncreate () {

View file

@ -1,49 +0,0 @@
const getDefault = mod => mod.default
export const importShowAccountProfileOptionsDialog = () => import(
/* webpackChunkName: 'showAccountProfileOptionsDialog' */ './creators/showAccountProfileOptionsDialog'
).then(getDefault)
export const importShowComposeDialog = () => import(
/* webpackChunkName: 'showComposeDialog' */ './creators/showComposeDialog'
).then(getDefault)
export const importShowTextConfirmationDialog = () => import(
/* webpackChunkName: 'showTextConfirmationDialog' */ './creators/showTextConfirmationDialog'
).then(getDefault)
export const importShowEmojiDialog = () => import(
/* webpackChunkName: 'showEmojiDialog' */ './creators/showEmojiDialog'
).then(getDefault)
export const importShowPostPrivacyDialog = () => import(
/* webpackChunkName: 'showPostPrivacyDialog' */ './creators/showPostPrivacyDialog'
).then(getDefault)
export const importShowStatusOptionsDialog = () => import(
/* webpackChunkName: 'showStatusOptionsDialog' */ './creators/showStatusOptionsDialog'
).then(getDefault)
export const importShowCopyDialog = () => import(
/* webpackChunkName: 'showCopyDialog' */ './creators/showCopyDialog'
).then(getDefault)
export const importShowShortcutHelpDialog = () => import(
/* webpackChunkName: 'showShortcutHelpDialog' */ './creators/showShortcutHelpDialog'
).then(getDefault)
export const importShowMediaDialog = () => import(
/* webpackChunkName: 'showMediaDialog' */ './creators/showMediaDialog'
).then(getDefault)
export const importShowMuteDialog = () => import(
/* webpackChunkName: 'showMuteDialog' */ './creators/showMuteDialog'
).then(getDefault)
export const importShowReportDialog = () => import(
/* webpackChunkName: 'showReportDialog' */ './creators/showReportDialog'
).then(getDefault)
export const importShowMediaEditDialog = () => import(
/* webpackChunkName: 'showMediaEditDialog' */ './creators/showMediaEditDialog'
).then(getDefault)

View file

@ -0,0 +1,3 @@
export const importShowAccountProfileOptionsDialog = () => import(
/* webpackChunkName: 'showAccountProfileOptionsDialog' */ '../creators/showAccountProfileOptionsDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowComposeDialog = () => import(
/* webpackChunkName: 'showComposeDialog' */ '../creators/showComposeDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowCopyDialog = () => import(
/* webpackChunkName: 'showCopyDialog' */ '../creators/showCopyDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowEmojiDialog = () => import(
/* webpackChunkName: 'showEmojiDialog' */ '../creators/showEmojiDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowMediaDialog = () => import(
/* webpackChunkName: 'showMediaDialog' */ '../creators/showMediaDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowMediaEditDialog = () => import(
/* webpackChunkName: 'showMediaEditDialog' */ '../creators/showMediaEditDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowMuteDialog = () => import(
/* webpackChunkName: 'showMuteDialog' */ '../creators/showMuteDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowPostPrivacyDialog = () => import(
/* webpackChunkName: 'showPostPrivacyDialog' */ '../creators/showPostPrivacyDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowReportDialog = () => import(
/* webpackChunkName: 'showReportDialog' */ '../creators/showReportDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowShortcutHelpDialog = () => import(
/* webpackChunkName: 'showShortcutHelpDialog' */ '../creators/showShortcutHelpDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowStatusOptionsDialog = () => import(
/* webpackChunkName: 'showStatusOptionsDialog' */ '../creators/showStatusOptionsDialog'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importShowTextConfirmationDialog = () => import(
/* webpackChunkName: 'showTextConfirmationDialog' */ '../creators/showTextConfirmationDialog'
).then(mod => mod.default)

View file

@ -123,7 +123,7 @@
</style>
<script>
import IconButton from '../IconButton.html'
import { importShowAccountProfileOptionsDialog } from '../dialog/asyncDialogs'
import { importShowAccountProfileOptionsDialog } from '../dialog/asyncDialogs/importShowAccountProfileOptionsDialog.js'
const numberFormat = new Intl.NumberFormat('en-US')

View file

@ -124,7 +124,7 @@
import { removeEmoji } from '../../_utils/removeEmoji'
import { store } from '../../_store/store'
import Label from '../Label.html'
import { importShowMediaDialog } from '../dialog/asyncDialogs'
import { importShowMediaDialog } from '../dialog/asyncDialogs/importShowMediaDialog.js'
import { getImageNativeDimensions } from '../../_utils/getImageNativeDimensions'
export default {

View file

@ -21,7 +21,7 @@
</style>
<script>
import { store } from '../../../_store/store'
import { importShowTextConfirmationDialog } from '../../dialog/asyncDialogs'
import { importShowTextConfirmationDialog } from '../../dialog/asyncDialogs/importShowTextConfirmationDialog.js'
import { switchToInstance, logOutOfInstance } from '../../../_actions/instances'
export default {

View file

@ -41,7 +41,7 @@
</style>
<script>
import { store } from '../../../_store/store'
import { importShowTextConfirmationDialog } from '../../dialog/asyncDialogs'
import { importShowTextConfirmationDialog } from '../../dialog/asyncDialogs/importShowTextConfirmationDialog.js'
import { logOutOfInstance } from '../../../_actions/instances'
import { updatePushSubscriptionForInstance, updateAlerts } from '../../../_actions/pushSubscription'
import { toast } from '../../toast/toast'

View file

@ -1,4 +1,4 @@
import { importSnackbar } from '../../_utils/asyncModules'
import { importSnackbar } from '../../_utils/asyncModules/importSnackbar.js'
let snackbar

View file

@ -102,7 +102,7 @@
</style>
<script>
import { DEFAULT_MEDIA_WIDTH, DEFAULT_MEDIA_HEIGHT, ONE_TRANSPARENT_PIXEL } from '../../_static/media'
import { importShowMediaDialog } from '../dialog/asyncDialogs'
import { importShowMediaDialog } from '../dialog/asyncDialogs/importShowMediaDialog.js'
import { mouseover } from '../../_utils/events'
import NonAutoplayGifv from '../NonAutoplayGifv.html'
import PlayVideoIcon from '../PlayVideoIcon.html'

View file

@ -69,7 +69,7 @@
import { registerClickDelegates } from '../../_utils/delegate'
import { setFavorited } from '../../_actions/favorite'
import { setReblogged } from '../../_actions/reblog'
import { importShowStatusOptionsDialog } from '../dialog/asyncDialogs'
import { importShowStatusOptionsDialog } from '../dialog/asyncDialogs/importShowStatusOptionsDialog.js'
import { updateProfileAndRelationship } from '../../_actions/accounts'
import { FAVORITE_ANIMATION, REBLOG_ANIMATION } from '../../_static/animations'
import { on } from '../../_utils/eventBus'

View file

@ -10,7 +10,8 @@
</style>
<script>
import { store } from '../../_store/store'
import { importLoggedInStoreExtensions, importTimeline } from '../../_utils/asyncModules'
import { importLoggedInStoreExtensions } from '../../_utils/asyncModules/importLoggedInStoreExtensions'
import { importTimeline } from '../../_utils/asyncModules/importTimeline'
export default {
async oncreate () {

View file

@ -33,12 +33,10 @@
import MoreHeaderVirtualWrapper from './MoreHeaderVirtualWrapper.html'
import ScrollListShortcuts from '../shortcut/ScrollListShortcuts.html'
import Shortcut from '../shortcut/Shortcut.html'
import {
importVirtualList,
importList,
importStatusVirtualListItem,
importNotificationVirtualListItem
} from '../../_utils/asyncModules'
import { importVirtualList } from '../../_utils/asyncModules/importVirtualList'
import { importList } from '../../_utils/asyncModules/importList'
import { importStatusVirtualListItem } from '../../_utils/asyncModules/importStatusVirtualListItem'
import { importNotificationVirtualListItem } from '../../_utils/asyncModules/importNotificationVirtualListItem'
import { timelines } from '../../_static/timelines'
import {
fetchMoreItemsAtBottomOfTimeline,

View file

@ -1,4 +1,4 @@
import { importToast } from '../../_utils/asyncModules'
import { importToast } from '../../_utils/asyncModules/importToast.js'
let toast

View file

@ -2,7 +2,7 @@
// put an async import of the database, to avoid including it in the main bundle
// (which doesn't need to run when the user isn't logged in).
import { importDatabase } from '../_utils/asyncModules'
import { importDatabase } from '../_utils/asyncModules/importDatabase.js'
const handler = {
get: function (obj, prop) {

View file

@ -1,4 +1,4 @@
import { importEmojiMart } from '../_utils/asyncModules'
import { importEmojiMart } from '../_utils/asyncModules/importEmojiMart.js'
import { loadCSS } from '../_utils/loadCSS'
async function fetchEmojiMartData () {

View file

@ -1,7 +1,7 @@
// Makes it so the left and right arrows change focus, ala Tab/Shift+Tab. This is mostly designed
// for KaiOS devices.
import { importArrowKeyNavigation } from '../../_utils/asyncModules'
import { importArrowKeyNavigation } from '../../_utils/asyncModules/importArrowKeyNavigation.js'
let arrowKeyNav

View file

@ -1,4 +1,4 @@
import { importLoggedInStoreExtensions } from '../../_utils/asyncModules'
import { importLoggedInStoreExtensions } from '../../_utils/asyncModules/importLoggedInStoreExtensions.js'
// An observer that calls an observer... this is a bit weird, but it eliminates
// circular dependencies and also allows us to lazy load observers/computations

View file

@ -1,65 +0,0 @@
const getDefault = mod => mod.default
export const importTimeline = () => import(
/* webpackChunkName: 'Timeline' */ '../_components/timeline/Timeline.html'
).then(getDefault)
export const importVirtualList = () => import(
/* webpackChunkName: 'VirtualList.html' */ '../_components/virtualList/VirtualList.html'
).then(getDefault)
export const importList = () => import(
/* webpackChunkName: 'List.html' */ '../_components/list/List.html'
).then(getDefault)
export const importStatusVirtualListItem = () => import(
/* webpackChunkName: 'StatusVirtualListItem.html' */ '../_components/timeline/StatusVirtualListItem.html'
).then(getDefault)
export const importNotificationVirtualListItem = () => import(
/* webpackChunkName: 'NotificationVirtualListItem.html' */ '../_components/timeline/NotificationVirtualListItem.html'
).then(getDefault)
export const importDatabase = () => import(
/* webpackChunkName: 'database.js' */ '../_database/databaseApis.js'
)
export const importLoggedInStoreExtensions = () => import(
/* webpackChunkName: 'loggedInStoreExtensions.js' */ '../_store/loggedInStoreExtensions.js'
)
export const importNavShortcuts = () => import(
/* webpackChunkName: 'NavShortcuts' */ '../_components/NavShortcuts.html'
).then(getDefault)
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)
export const importSnackbar = () => import(
/* webpackChunkName: 'Snackbar.html' */ '../_components/snackbar/Snackbar.html'
).then(getDefault)
export const importComposeBox = () => import(
/* webpackChunkName: 'ComposeBox.html' */ '../_components/compose/ComposeBox.html'
).then(getDefault)
export const importTesseractWorker = () => import(
/* webpackChunkName: 'tesseractWorker' */ '../_utils/tesseractWorker.js'
).then(getDefault)
export const importVirtualListStore = () => import(
/* webpackChunkName: 'virtualListStore.js' */ '../_components/virtualList/virtualListStore.js'
)
export const importPageLifecycle = () => import(
/* webpackChunkName: 'page-lifecycle' */ 'page-lifecycle/dist/lifecycle.mjs'
).then(getDefault)
export const importArrowKeyNavigation = () => import(
/* webpackChunkName: 'arrow-key-navigation' */ 'arrow-key-navigation'
)

View file

@ -0,0 +1,3 @@
export const importArrowKeyNavigation = () => import(
/* webpackChunkName: 'arrow-key-navigation' */ 'arrow-key-navigation'
)

View file

@ -0,0 +1,3 @@
export const importComposeBox = () => import(
/* webpackChunkName: 'ComposeBox.html' */ '../../_components/compose/ComposeBox.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importDatabase = () => import(
/* webpackChunkName: 'database.js' */ '../../_database/databaseApis.js'
)

View file

@ -0,0 +1,3 @@
export const importEmojiMart = () => import(
/* webpackChunkName: 'createEmojiMartPickerFromData.js' */ '../../_react/createEmojiMartPickerFromData.js'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importList = () => import(
/* webpackChunkName: 'List.html' */ '../../_components/list/List.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importLoggedInStoreExtensions = () => import(
/* webpackChunkName: 'loggedInStoreExtensions.js' */ '../../_store/loggedInStoreExtensions.js'
)

View file

@ -0,0 +1,3 @@
export const importNavShortcuts = () => import(
/* webpackChunkName: 'NavShortcuts' */ '../../_components/NavShortcuts.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importNotificationVirtualListItem = () => import(
/* webpackChunkName: 'NotificationVirtualListItem.html' */ '../../_components/timeline/NotificationVirtualListItem.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importPageLifecycle = () => import(
/* webpackChunkName: 'page-lifecycle' */ 'page-lifecycle/dist/lifecycle.mjs'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importSnackbar = () => import(
/* webpackChunkName: 'Snackbar.html' */ '../../_components/snackbar/Snackbar.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importStatusVirtualListItem = () => import(
/* webpackChunkName: 'StatusVirtualListItem.html' */ '../../_components/timeline/StatusVirtualListItem.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importTesseractWorker = () => import(
/* webpackChunkName: 'tesseractWorker' */ '../../_utils/tesseractWorker.js'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importTimeline = () => import(
/* webpackChunkName: 'Timeline' */ '../../_components/timeline/Timeline.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importToast = () => import(
/* webpackChunkName: 'Toast.html' */ '../../_components/toast/Toast.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importVirtualList = () => import(
/* webpackChunkName: 'VirtualList.html' */ '../../_components/virtualList/VirtualList.html'
).then(mod => mod.default)

View file

@ -0,0 +1,3 @@
export const importVirtualListStore = () => import(
/* webpackChunkName: 'virtualListStore.js' */ '../../_components/virtualList/virtualListStore.js'
)

View file

@ -1,6 +1,6 @@
// the page-lifecycle package causes some problems (doesn't work in node),
// and plus it's not needed immediately, so lazy-load it
import { importPageLifecycle } from './asyncModules'
import { importPageLifecycle } from './asyncModules/importPageLifecycle.js'
function addEventListener (event, func) {
if (process.browser) {

View file

@ -1,4 +1,4 @@
import { importTesseractWorker } from '../_utils/asyncModules'
import { importTesseractWorker } from '../_utils/asyncModules/importTesseractWorker.js'
const DESTROY_WORKER_DELAY = 300000 // 5 minutes

View file

@ -3,7 +3,7 @@
import { store } from './_store/store'
import { goto } from '../../__sapper__/client'
import { decodeURIComponentWithPluses } from './_utils/decodeURIComponentWithPluses'
import { importLoggedInStoreExtensions } from './_utils/asyncModules'
import { importLoggedInStoreExtensions } from './_utils/asyncModules/importLoggedInStoreExtensions.js'
const SHARE_KEYS = ['title', 'text', 'url']