frontendove optimalizacie

frontend/src/App.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { lazy, Suspense, useEffect } from 'react';
 import { BrowserRouter, Routes, Route, Navigate, useNavigate, useLocation, useNavigationType } from 'react-router-dom';
 import { useGameStore } from './store/gameStore';
 import { socket, emit } from './lib/socket';
@@ -8,8 +8,10 @@ import Lobby from './pages/Lobby';
 import GameTable from './pages/GameTable';
 import Auth from './pages/Auth';
 import History from './pages/History';
-import AdminLayout from './pages/admin/AdminLayout';
-import AdminStats from './pages/admin/AdminStats';
+
+// Admin pulls in recharts — lazy-load it so players never download that chunk.
+const AdminLayout = lazy(() => import('./pages/admin/AdminLayout'));
+const AdminStats = lazy(() => import('./pages/admin/AdminStats'));
 
 function AppInner() {
   const navigate = useNavigate();
@@ -89,18 +91,20 @@ function AppInner() {
           {error}
         </div>
       )}
-      <Routes>
-        <Route path="/auth" element={<Auth />} />
-        <Route path="/" element={<GameList />} />
-        <Route path="/history" element={<History />} />
-        <Route path="/lobby/:gid" element={<Lobby />} />
-        <Route path="/game/:gid" element={<GameTable />} />
-        <Route path="/admin" element={<AdminLayout />}>
-          <Route index element={<Navigate to="stats" replace />} />
-          <Route path="stats" element={<AdminStats />} />
-        </Route>
-        <Route path="*" element={<Navigate to="/" replace />} />
-      </Routes>
+      <Suspense fallback={<p className="text-center text-green-dim pt-20 font-serif italic">Načítava sa…</p>}>
+        <Routes>
+          <Route path="/auth" element={<Auth />} />
+          <Route path="/" element={<GameList />} />
+          <Route path="/history" element={<History />} />
+          <Route path="/lobby/:gid" element={<Lobby />} />
+          <Route path="/game/:gid" element={<GameTable />} />
+          <Route path="/admin" element={<AdminLayout />}>
+            <Route index element={<Navigate to="stats" replace />} />
+            <Route path="stats" element={<AdminStats />} />
+          </Route>
+          <Route path="*" element={<Navigate to="/" replace />} />
+        </Routes>
+      </Suspense>
     </>
   );
 }