performance optimierungen, lazy loads etc. - plus requesttimingmiddleware, die lokal die performance trackt und loggt.

resources/js/admin/main.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Suspense } from 'react';
 import { createRoot } from 'react-dom/client';
 import { RouterProvider } from 'react-router-dom';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
@@ -9,7 +9,8 @@ import './i18n';
 import './dev-tools';
 import { initializeTheme } from '@/hooks/use-appearance';
 import { OnboardingProgressProvider } from './onboarding';
-import { DevTenantSwitcher } from './components/DevTenantSwitcher';
+
+const DevTenantSwitcher = React.lazy(() => import('./components/DevTenantSwitcher'));
 
 const enableDevSwitcher = import.meta.env.DEV || import.meta.env.VITE_ENABLE_TENANT_SWITCHER === 'true';
 
@@ -28,10 +29,22 @@ createRoot(rootEl).render(
     <QueryClientProvider client={queryClient}>
       <AuthProvider>
         <OnboardingProgressProvider>
-          <RouterProvider router={router} />
+          <Suspense
+            fallback={(
+              <div className="flex min-h-screen items-center justify-center text-sm text-muted-foreground">
+                Oberfläche wird geladen …
+              </div>
+            )}
+          >
+            <RouterProvider router={router} />
+          </Suspense>
         </OnboardingProgressProvider>
       </AuthProvider>
-      {enableDevSwitcher ? <DevTenantSwitcher /> : null}
+      {enableDevSwitcher ? (
+        <Suspense fallback={null}>
+          <DevTenantSwitcher />
+        </Suspense>
+      ) : null}
     </QueryClientProvider>
   </React.StrictMode>
 );