perf: 前端打包产物优化——路由级懒加载和 vendor 分包

- 使用 React.lazy() + Suspense 实现路由级代码分割
- 配置 manualChunks 将 react/tdesign/recharts 拆分为独立 vendor chunk
- 页面组件改为 export default 以支持动态导入
- 新增 bundle-optimization 规范，更新 frontend 导航规范

frontend/src/pages/NotFound.tsx

@@ -1,7 +1,7 @@
 import { Button } from 'tdesign-react';
 import { useNavigate } from 'react-router';
 
-export function NotFound() {
+export default function NotFound() {
   const navigate = useNavigate();
 
   return (

frontend/src/pages/Providers/index.tsx

@@ -6,7 +6,7 @@ import { ProviderTable } from './ProviderTable';
 import { ProviderForm } from './ProviderForm';
 import { ModelForm } from './ModelForm';
 
-export function ProvidersPage() {
+export default function ProvidersPage() {
   const { data: providers = [], isLoading } = useProviders();
   const createProvider = useCreateProvider();
   const updateProvider = useUpdateProvider();

frontend/src/pages/Settings/index.tsx

@@ -1,6 +1,6 @@
 import { Card } from 'tdesign-react';
 
-export function SettingsPage() {
+export default function SettingsPage() {
   return (
     <Card title="设置">
       <div style={{ textAlign: 'center', padding: '40px 0', color: 'var(--td-text-color-placeholder)' }}>

frontend/src/pages/Stats/index.tsx

@@ -5,7 +5,7 @@ import { StatCards } from './StatCards';
 import { UsageChart } from './UsageChart';
 import { StatsTable } from './StatsTable';
 
-export function StatsPage() {
+export default function StatsPage() {
   const { data: providers = [] } = useProviders();
 
   const [providerId, setProviderId] = useState<string | undefined>();

frontend/src/routes/index.tsx

@@ -1,20 +1,25 @@
+import { lazy, Suspense } from 'react';
 import { Routes, Route, Navigate } from 'react-router';
+import { Loading } from 'tdesign-react';
 import { AppLayout } from '@/components/AppLayout';
-import { ProvidersPage } from '@/pages/Providers';
-import { StatsPage } from '@/pages/Stats';
-import { SettingsPage } from '@/pages/Settings';
-import { NotFound } from '@/pages/NotFound';
+
+const ProvidersPage = lazy(() => import('@/pages/Providers'));
+const StatsPage = lazy(() => import('@/pages/Stats'));
+const SettingsPage = lazy(() => import('@/pages/Settings'));
+const NotFound = lazy(() => import('@/pages/NotFound'));
 
 export function AppRoutes() {
   return (
-    <Routes>
-      <Route element={<AppLayout />}>
-        <Route index element={<Navigate to="/providers" replace />} />
-        <Route path="providers" element={<ProvidersPage />} />
-        <Route path="stats" element={<StatsPage />} />
-        <Route path="settings" element={<SettingsPage />} />
-        <Route path="*" element={<NotFound />} />
-      </Route>
-    </Routes>
+    <Suspense fallback={<Loading />}>
+      <Routes>
+        <Route element={<AppLayout />}>
+          <Route index element={<Navigate to="/providers" replace />} />
+          <Route path="providers" element={<ProvidersPage />} />
+          <Route path="stats" element={<StatsPage />} />
+          <Route path="settings" element={<SettingsPage />} />
+          <Route path="*" element={<NotFound />} />
+        </Route>
+      </Routes>
+    </Suspense>
   );
 }