u

src/appRouter.jsx

@@ -1,3 +1,4 @@
+import { lazy } from 'react';
 import { Navigate, createBrowserRouter } from 'react-router-dom';
 import AppShell from './components/AppShell';
 import SectionLayout from './components/SectionLayout';
@@ -24,11 +25,10 @@ import KundeListePage from './routes/kunde';
 import KundeNeuPage from './routes/kunde/neu';
 import KundeGruppenPage from './routes/kunde/gruppen';
 import KundeEditPage from './routes/kunde/_entityId';
-import {
-  ArticleHistoryPage,
-  GlobalHistoryPage,
-  StatisticsPage,
-} from './routes/infos';
+import StatisticsPage from './routes/infos/StatisticsPage';
+
+const ArticleHistoryPage = lazy(() => import('./routes/infos/ArticleHistoryPage'));
+const GlobalHistoryPage = lazy(() => import('./routes/infos/GlobalHistoryPage'));
 
 const routes = [
   {

src/automats/articleHistoryAutomat.js

@@ -9,7 +9,7 @@
  * - AG Grid: Triggers `fetchRows()` on viewport scroll, sort, or filter changes.
  */
 
-import { createGridAutomat } from 'react-virtual-aggridautomat';
+import { createGridAutomat } from 'react-virtual-aggridautomat/createGridAutomat';
 import { article } from '../api';
 import authAutomat from './authAutomat';
 

src/automats/globalHistoryAutomat.js

@@ -9,7 +9,7 @@
  * - AG Grid: Triggers `fetchRows()` on viewport scroll, sort, or filter changes.
  */
 
-import { createGridAutomat } from 'react-virtual-aggridautomat';
+import { createGridAutomat } from 'react-virtual-aggridautomat/createGridAutomat';
 import { globalHistory } from '../api';
 import authAutomat from './authAutomat';
 

src/components/SectionLayout.jsx

@@ -1,6 +1,7 @@
-import { useState, useRef, useEffect } from 'react';
+import { useState, useRef, useEffect, Suspense } from 'react';
 import { Outlet, useLocation } from 'react-router-dom';
 import Box from '@mui/material/Box';
+import CircularProgress from '@mui/material/CircularProgress';
 import Popover from '@mui/material/Popover';
 import MenuList from '@mui/material/MenuList';
 import MenuItem from '@mui/material/MenuItem';
@@ -198,7 +199,15 @@ export default function SectionLayout({ sectionPath }) {
       showTitle={!isArticleDetail}
       titleAction={titleAction}
     >
-      <Outlet />
+      <Suspense
+        fallback={
+          <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', py: 8 }}>
+            <CircularProgress />
+          </Box>
+        }
+      >
+        <Outlet />
+      </Suspense>
     </PageLayout>
   );
 }

vite.config.js

@@ -287,6 +287,15 @@ export default defineConfig(({ command }) => ({
         },
       },
     },
+    chunkSizeWarningLimit: 1000,
+    modulePreload: {
+      resolveDependencies(filename, deps, { hostType }) {
+        if (hostType === 'html') {
+          return deps.filter((dep) => !dep.includes('ag-grid') && !dep.includes('AutomatGrid'));
+        }
+        return deps;
+      },
+    },
   },
   plugins: [
     react(),