Files
www_projectmycelium_com/src/App.tsx
sasha-astiadi c0cbe7e6bf perf: implement lazy loading for route components
- Added React.lazy() for all page components to enable code splitting
- Wrapped Routes with Suspense component and loading fallback state
- Converted static imports to dynamic imports to reduce initial bundle size
- Added semicolons for consistent code style
2025-10-30 13:04:44 +01:00

36 lines
1.4 KiB
TypeScript

import { BrowserRouter, Routes, Route } from 'react-router-dom';
import { Layout } from './components/Layout';
import { lazy, Suspense } from 'react';
const HomePage = lazy(() => import('./pages/home/HomePage'));
const CloudPage = lazy(() => import('./pages/cloud/CloudPage'));
const NetworkPage = lazy(() => import('./pages/network/NetworkPage'));
const AgentsPage = lazy(() => import('./pages/agents/AgentsPage'));
const DownloadPage = lazy(() => import('./pages/download/DownloadPage'));
const ComputePage = lazy(() => import('./pages/compute/ComputePage'));
const StoragePage = lazy(() => import('./pages/storage/StoragePage'));
const GpuPage = lazy(() => import('./pages/gpu/GpuPage'));
function App() {
return (
<BrowserRouter>
<Suspense fallback={<div>Loading...</div>}>
<Routes>
<Route path="/" element={<Layout />}>
<Route index element={<HomePage />} />
<Route path="cloud" element={<CloudPage />} />
<Route path="network" element={<NetworkPage />} />
<Route path="agents" element={<AgentsPage />} />
<Route path="download" element={<DownloadPage />} />
<Route path="compute" element={<ComputePage />} />
<Route path="storage" element={<StoragePage />} />
<Route path="gpu" element={<GpuPage />} />
</Route>
</Routes>
</Suspense>
</BrowserRouter>
)
}
export default App