服务端组件

SSR 组件，Next 的默认模式。

服务端渲染有以下优点：

• 接口请求离服务端更近，耗时更少
• 敏感数据和逻辑可以保留在服务端
• 服务端可以缓存不同用户的多个请求，减少响应时间
• 减小客户端包大小
• 有利于 SEO 和分享

最终实现：

• 更快的首屏加载（LCP、FCP 等指标）
• 更好的用户体验

渲染流程

1. 根据路由和 Suspense 将应用分为 chunk
2. 每个 chunk 分为服务端和客户端两步渲染
   1. 服务端：
      1. React 把组件渲染为 RSC Payload
      2. Next 基于 RSC Payload 渲染 HTML
   2. 客户端：
      1. 很快显示一个不可交互的 HTML 页面
      2. 基于 RSC Payload 协调服务端和客户端的组件树
      3. 注水（事件处理）使页面可交互

渲染策略

• 静态渲染（static，默认）
  • 编译时渲染路由，输出静态页面，可以缓存、上传 CDN
  • 适合与请求无关的页面，比如博客、展示页
• 动态渲染（dynamic）
  • 请求时渲染路由
  • 适合与请求相关的页面，比如根据 search param 展示不同内容
• 流式渲染（streaming）
  • 把页面分为多个 chunk，并行加载和展示