-
[OPIK-6066] [FE] perf: lazy-load heaviest non-critical page routes
发布于
2026-04-21 15:31:55 +00:00 Converts the heaviest page imports in v1/router.tsx and v2/router.tsx
from static imports to React.lazy() so each page becomes its own chunk,
loaded only on navigation. Follows the SMEFlowPage precedent in both
routers.Pages converted:
- v1: PlaygroundPage, PromptPage, CompareExperimentsPage, AlertsRouteWrapper
- v2: PlaygroundPage, CompareExperimentsPage, AlertsRouteWrapper
TracesPage intentionally kept eager — it's on the critical path and
lazy-loading would cause a visible Loader flash on most sessions.Measured impact (production build, dist/assets):
- V1App chunk: 932 KB -> 801 KB (-131 KB, -14%)
- V2App chunk: 1074 KB -> 955 KB (-119 KB, -11%)
- Combined initial App payload: -250 KB
- Total JS across all chunks: +52 KB (+0.4%) — Rollup duplicates some
small shared modules across chunks; acceptable tax for the initial
payload reduction.
App-level <Suspense fallback={}> in WorkspaceVersionGate
covers the fallback for all new lazy route components — no new
Suspense boundaries needed.Co-Authored-By: Claude Opus 4.7 (1M context) noreply@anthropic.com
下载附件