tootaio.com/docs/20251106/performance.md

性能诊断与优化建议

现状与影响

• SSR/CSR（Medium）：默认 SSR，未针对首页静态化或增量缓存配置，变化不频繁的内容可降本提速。
• 资源缓存（Medium）：未设置构建产物（/_nuxt/**）的长期缓存与 immutable，重复访问浪费带宽。
• 图片与外链（Low）：OG 图与背景图使用外部域名，建议统一通过 CDN 域名与缓存规则管理。

Nuxt 4 定向优化

1. Route Rules 与 SWR（Medium）
   • 预渲染首页并启用 SWR：降低首屏 TTFB。
   • 长缓存构建产物：

     export default defineNuxtConfig({
       routeRules: {
         '/': { prerender: true, swr: 3600 },
         '/_nuxt/**': { headers: { 'cache-control': 'public, max-age=31536000, immutable' } },
       },
     })
     

   • 参见补丁：0004-nuxt-route-rules.patch。
2. 代码分割与懒加载（Low）
   • 仅在首屏需要时挂载大型组件（如轮播）；通过 v-if 配合 onMounted 或 client-only 降低 SSR 负载。
3. 构建与依赖（Low）
   • 保持 pnpm-lock.yaml 锁定；CI 使用 pnpm i --frozen-lockfile 保证可重复构建。
4. 图片与静态资源（Medium）
   • 将站点图片统一迁到自有 CDN（如 Cloudflare/Vercel Assets），配置缓存与压缩。
   • 如未来引入 @nuxt/image，优先使用自动格式与尺寸。

部署建议

• Node/Nitro（通用）：适合 SSR + SWR 与渐进更新。
• Edge（部份路由）：静态资源 + 首页可下放至边缘，注意依赖兼容性。
• Static/Generate：若大部分页面静态，可考虑 pnpm generate 并配合 CDN。