你可能会说
纯客户端渲染首屏白屏太久，SEO 也差，能不能服务器先渲染好？
SSR 是在服务器端执行 React 组件生成 HTML 发给浏览器——用户立即看到内容，JS 加载后再「激活」交互。
页面在服务器上先渲染成完整 HTML 再发给浏览器。好处是首屏快、SEO 友好；代价是服务器压力大。
生活类比
像餐厅提前做好菜端上来（SSR），而不是给你食材让你自己在桌上做（CSR）。
🎮 动手试试
👇 对比两种渲染模式的首屏体验
关于「SSR」，以下哪个描述最准确？
你可以这样告诉 AI
帮我配置 Next.js SSR：首页用动态渲染（force-dynamic），根据请求参数在服务端获取数据后渲染完整 HTML。
SSR 每次请求都在服务器渲染（动态），SSG 构建时就生成好 HTML（静态）。
CSR 服务器只发空壳 HTML + JS，浏览器执行 JS 后才渲染内容（白屏时间长）。
SEO 关键页面
博客文章、产品详情、营销落地页等需要搜索引擎完整收录的页面，SSR 让爬虫直接拿到渲染好的 HTML。
和 AI 协作时
想让 AI 配置 SSR 时，直接说「首页用动态渲染 force-dynamic，根据请求参数在服务端获取数据」。
纯交互工具
在线画板、代码编辑器、实时协作白板等不需要 SEO 的 SPA，CSR 就够了，加 SSR 反而增加服务器成本。
与 Web 渲染无关的项目
移动 App、CLI 工具、后端微服务等不需要服务器端渲染 HTML。
页面在服务器上先渲染成完整 HTML 再发给浏览器。好处是首屏快、SEO 友好；代价是服务器压力大。
像餐厅提前做好菜端上来（SSR），而不是给你食材让你自己在桌上做（CSR）。
Next.js 默认就是 SSR。提到「这个页面用 SSR」时，意思是服务器端生成 HTML。