From 63b98bff4d991a26b3a5dce881afbb870e54d737 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Sat, 7 Oct 2023 18:18:50 -0500
Subject: [PATCH] soapbox.tsx: load some components async, reduce bundle size

---
 src/containers/soapbox.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/containers/soapbox.tsx b/src/containers/soapbox.tsx
index d60f8eec0..eab298e34 100644
--- a/src/containers/soapbox.tsx
+++ b/src/containers/soapbox.tsx
@@ -13,11 +13,8 @@ import { loadInstance } from 'soapbox/actions/instance';
 import { fetchMe } from 'soapbox/actions/me';
 import { loadSoapboxConfig } from 'soapbox/actions/soapbox';
 import * as BuildConfig from 'soapbox/build-config';
-import GdprBanner from 'soapbox/components/gdpr-banner';
-import Helmet from 'soapbox/components/helmet';
 import LoadingScreen from 'soapbox/components/loading-screen';
 import { StatProvider } from 'soapbox/contexts/stat-context';
-import EmbeddedStatus from 'soapbox/features/embedded-status';
 import {
   ModalContainer,
   OnboardingWizard,
@@ -42,9 +39,13 @@ import { generateThemeCss } from 'soapbox/utils/theme';
 import { checkOnboardingStatus } from '../actions/onboarding';
 import { preload } from '../actions/preload';
 import ErrorBoundary from '../components/error-boundary';
-import UI from '../features/ui';
 import { store } from '../store';
 
+const GdprBanner = React.lazy(() => import('soapbox/components/gdpr-banner'));
+const Helmet = React.lazy(() => import('soapbox/components/helmet'));
+const EmbeddedStatus = React.lazy(() => import('soapbox/features/embedded-status'));
+const UI = React.lazy(() => import('soapbox/features/ui'));
+
 // Configure global functions for developers
 createGlobals(store);