refactor(app): 优化应用加载性能

- 将桌面端模态框组件提取为独立模块 desktop-modal-host.tsx
- 将移动端模态框组件提取为独立模块 mobile-modal-host.tsx
- 使用懒加载和 Suspense 包装入口页面和模态框组件
- 将 React Query Devtools 改为按需加载
- 配置 Vite 构建优化，设置第三方库分包策略
- 替换 lottie-web 为轻量级版本以减少包体积

src/main.tsx

@@ -1,7 +1,6 @@
 import { QueryClientProvider } from '@tanstack/react-query'
-import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
 import { RouterProvider } from '@tanstack/react-router'
-import { StrictMode } from 'react'
+import { lazy, StrictMode, Suspense } from 'react'
 import { createRoot } from 'react-dom/client'
 import { getCurrentUserProfile, refreshAuthSession } from '@/api'
 import { AppBootResourceGate } from '@/components/app-boot-resource-gate'
@@ -23,6 +22,15 @@ const rootElement = document.getElementById(APP_ROOT_ELEMENT_ID)
 const shouldShowQueryDevtools =
   import.meta.env.VITE_APP_ENV === 'development' &&
   import.meta.env.VITE_ENABLE_QUERY_DEVTOOLS === 'true'
+const QueryDevtools = shouldShowQueryDevtools
+  ? lazy(async () => {
+      const { ReactQueryDevtools } = await import(
+        '@tanstack/react-query-devtools'
+      )
+
+      return { default: ReactQueryDevtools }
+    })
+  : null
 
 if (!rootElement) {
   throw new Error('Root element not found')
@@ -46,8 +54,10 @@ createRoot(rootElement).render(
         <GlobalAudioController />
         <RouterProvider router={router} />
         <AppNotificationAlert />
-        {shouldShowQueryDevtools && (
-          <ReactQueryDevtools initialIsOpen={false} />
+        {QueryDevtools && (
+          <Suspense fallback={null}>
+            <QueryDevtools initialIsOpen={false} />
+          </Suspense>
         )}
       </AppBootResourceGate>
     </QueryClientProvider>