Problem: The worksheet page had 1.7-2.3s TTFB because the 1.25MB SVG preview was being serialized into the initial HTML response, blocking first paint. Solution: Use React Suspense to stream the preview separately: - Page shell renders immediately with settings (~200ms TTFB) - Preview generates async and streams in when ready (~1.5s later) - User sees the UI instantly, preview appears with loading skeleton New components: - StreamedPreview: async server component that generates preview - PreviewSkeleton: loading placeholder while streaming - StreamedPreviewContext: shares streamed data with PreviewCenter - PreviewDataInjector: bridges server-streamed data to client context Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| web | ||