perf: ~40ms improvement: Lazy load controllers and page components

This commit is contained in:
Feross Aboukhadijeh
2016-10-01 01:09:51 -07:00
parent 5815d8efe7
commit fcae064dbb
8 changed files with 107 additions and 87 deletions

View File

@@ -1,32 +1,36 @@
const colors = require('material-ui/styles/colors')
const createGetter = require('fn-getter')
const React = require('react')
const darkBaseTheme = require('material-ui/styles/baseThemes/darkBaseTheme').default
const lightBaseTheme = require('material-ui/styles/baseThemes/lightBaseTheme').default
const getMuiTheme = require('material-ui/styles/getMuiTheme').default
const MuiThemeProvider = require('material-ui/styles/MuiThemeProvider').default
const Header = require('../components/header')
const TorrentListPage = require('./torrent-list-page')
const Views = {
'home': require('./torrent-list-page'),
'player': require('./player-page'),
'create-torrent': require('./create-torrent-page'),
'preferences': require('./preferences-page')
'home': createGetter(() => TorrentListPage),
'player': createGetter(() => require('./player-page')),
'create-torrent': createGetter(() => require('./create-torrent-page')),
'preferences': createGetter(() => require('./preferences-page'))
}
const Modals = {
'open-torrent-address-modal': require('../components/open-torrent-address-modal'),
'remove-torrent-modal': require('../components/remove-torrent-modal'),
'update-available-modal': require('../components/update-available-modal'),
'unsupported-media-modal': require('../components/unsupported-media-modal')
'open-torrent-address-modal': createGetter(
() => require('../components/open-torrent-address-modal')
),
'remove-torrent-modal': createGetter(() => require('../components/remove-torrent-modal')),
'update-available-modal': createGetter(() => require('../components/update-available-modal')),
'unsupported-media-modal': createGetter(() => require('../components/unsupported-media-modal'))
}
const fontFamily = process.platform === 'win32'
? '"Segoe UI", sans-serif'
: 'BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif'
lightBaseTheme.fontFamily = fontFamily
darkBaseTheme.fontFamily = fontFamily
darkBaseTheme.userAgent = false
darkBaseTheme.palette.primary1Color = colors.grey50
darkBaseTheme.palette.primary2Color = colors.grey50
darkBaseTheme.palette.primary3Color = colors.grey600
@@ -88,7 +92,12 @@ class App extends React.Component {
getModal () {
const state = this.props.state
if (!state.modal) return
const ModalContents = Modals[state.modal.id]
const lightBaseTheme = require('material-ui/styles/baseThemes/lightBaseTheme').default
lightBaseTheme.fontFamily = fontFamily
lightBaseTheme.userAgent = false
const ModalContents = Modals[state.modal.id]()
return (
<MuiThemeProvider muiTheme={getMuiTheme(lightBaseTheme)}>
<div key='modal' className='modal'>
@@ -103,7 +112,7 @@ class App extends React.Component {
getView () {
const state = this.props.state
const View = Views[state.location.url()]
const View = Views[state.location.url()]()
return (<View state={state} />)
}
}