2.2.2.2 App Shell架构原理

文档摘要

2.2.2.2 App Shell架构原理 2.2.2.2 App Shell架构原理：当“壳”开始呼吸——一个被忽略的 hydration 时序陷阱与可复用的 SSR + CSR 协同方案你有没有遇到过这样的场景？页面首屏渲染快得像一道光——Lighthouse 给你打出了 98 分；但用户点击导航按钮后，下一屏却卡顿半秒、白屏一闪、再闪出内容； FID（首次输入延迟）指标悄然恶化； DevTools 的 Performance 面板里，那一长条紫色任务块，像一根烧红的铁钎，狠狠插在主线程上——而它出现的位置，恰好是你刚跳转到的、本该“已缓存就绪”的路由页。这不是 React 慢。不是 Vite 打包有问题。甚至不是你的服务端渲染（SSR）没做好。