diff --git a/client/src/javascript/app.tsx b/client/src/javascript/app.tsx
index e1496e15..9012c3cf 100644
--- a/client/src/javascript/app.tsx
+++ b/client/src/javascript/app.tsx
@@ -1,6 +1,6 @@
import {Router} from 'react-router-dom';
import {FormattedMessage} from 'react-intl';
-import {Route} from 'react-router';
+import {Route, Switch} from 'react-router';
import React from 'react';
import ReactDOM from 'react-dom';
@@ -8,22 +8,28 @@ import AsyncIntlProvider from './i18n/languages';
import connectStores from './util/connectStores';
import AppWrapper from './components/AppWrapper';
import AuthActions from './actions/AuthActions';
-import FloodActions from './actions/FloodActions';
import history from './util/history';
import Languages from './constants/Languages';
import LoadingIndicator from './components/general/LoadingIndicator';
-import Login from './components/views/Login';
-import Register from './components/views/Register';
import SettingsStore from './stores/SettingsStore';
-import TorrentClientOverview from './components/views/TorrentClientOverview';
import UIStore from './stores/UIStore';
import '../sass/style.scss';
+const Login = React.lazy(() => import('./components/views/Login'));
+const Register = React.lazy(() => import('./components/views/Register'));
+const TorrentClientOverview = React.lazy(() => import('./components/views/TorrentClientOverview'));
+
interface FloodAppProps {
locale?: keyof typeof Languages;
}
+const loadingOverlay = (
+
+
+
+);
+
const initialize = (): void => {
UIStore.registerDependency([
{
@@ -62,7 +68,6 @@ const initialize = (): void => {
if (initialUser) {
history.replace('register');
} else {
- FloodActions.startActivityStream();
history.replace('overview');
}
},
@@ -75,9 +80,11 @@ const initialize = (): void => {
const appRoutes = (
-
-
-
+
+
+
+
+
);
@@ -89,12 +96,7 @@ class FloodApp extends React.Component {
public render(): React.ReactNode {
return (
-
-
-
- }>
+
{appRoutes}
);
diff --git a/client/src/javascript/components/views/TorrentClientOverview.tsx b/client/src/javascript/components/views/TorrentClientOverview.tsx
index b410167e..2cd38a8a 100644
--- a/client/src/javascript/components/views/TorrentClientOverview.tsx
+++ b/client/src/javascript/components/views/TorrentClientOverview.tsx
@@ -1,15 +1,21 @@
import React from 'react';
import ActionBar from '../torrent-list/ActionBar';
-import Alerts from '../alerts/Alerts';
import ApplicationContent from '../layout/ApplicationContent';
import ApplicationPanel from '../layout/ApplicationPanel';
import ApplicationView from '../layout/ApplicationView';
-import Modals from '../modals/Modals';
+import FloodActions from '../../actions/FloodActions';
import Sidebar from '../sidebar/Sidebar';
import TorrentList from '../torrent-list/TorrentList';
+const Alerts = React.lazy(() => import('../alerts/Alerts'));
+const Modals = React.lazy(() => import('../modals/Modals'));
+
export default class TorrentClientOverview extends React.Component {
+ async componentDidMount() {
+ FloodActions.startActivityStream();
+ }
+
render() {
return (