主流浏览器已基本废弃 link rel="prerender"，Chrome v110起默认禁用，Firefox和Safari从未支持，Edge同步弃用；实际仅可能做DNS预解析或TCP预连接，不加载HTML、不执行JS、不渲染DOM。
目前主流浏览器已基本废弃 link rel="prerender"，无法可靠预渲染页面，不建议在生产环境依赖它。
为什么 link rel="prerender" 现在基本失效
Chrome 从 v110 起默认禁用 prerender（仅保留实验性支持），Firefox 和 Safari 从未实现；Edge 基于 Chromium 同步弃用。实际行为是：浏览器忽略该标签，或仅做 DNS 预解析、TCP 预连接，不会加载 HTML、执行 JS、渲染 DOM。
- 触发条件苛刻：需页面处于前台、空闲 CPU、足够内存，且目标页必须同源（部分版本还要求 HTTPS）
- 用户切换 Tab 或滚动页面会立即中止 prerender
- 开发者工具的 Network / Application 面板里几乎看不到 prerender 请求痕迹，容易误判“生效了”
替代方案：用 link rel="prefetch" + 手动 hydrate 更可控
prefetch 是当前最广泛支持的资源预取方式，它只下载 HTML（不执行），配合前端路由可实现接近 prerender 的体验。
- 在关键入口页（如首页导航栏）添加：
<link rel="prefetch" href="/product/123" as="document">
- 当用户 hover 或 focus 到对应链接时，可提前调用
fetch()获取 HTML，再用DOMParser解析，或直接注入<iframe hidden>触发轻量级预解析 - 真正点击时，若预取完成，可跳过网络请求，直接用缓存内容 +
React.hydrateRoot()或Vue.createApp().mount()快速激活 - 注意设置
as="document"，否则浏览器可能按fetch普通资源处理，不走 HTTP cache for HTML 流程
服务端预渲染（SSR）仍是关键页首屏最优解
如果目标是提升 LCP、避免白屏，prerender 的原始诉求其实早已被 SSR / SSG 更稳定地覆盖。
- Next.js 的
getStaticProps或 Nuxt 的generate可在构建时产出完整 HTML，CDN 直接返回，无 JS 依赖 - 对于动态关键页（如用户仪表盘），用 SSR + 缓存策略（如 Vercel Edge Middleware 设置
Cache-Control: s-maxage=300）比客户端 prerender 更可靠 - 若必须用纯静态部署，可搭配
prerender-spa-plugin（Webpack）或@prerenderer/renderer-puppeteer（Vite）生成快照，但要注意：登录态、实时数据、CSR 交互逻辑仍需二次 hydration
真正难的是权衡——预渲染的收益是否值得增加构建复杂度、缓存失效风险和首屏 JS 包体积？多数场景下，精准的 prefetch + 服务端缓存 + 关键 CSS 内联，比幻想浏览器替你“偷偷渲染”更实在。
