前端
服务端渲染SSR
你可能会问
服务端渲染到底是什么？页面是在谁的电脑上「拼」出来的？
简单来说
在服务器上先把页面拼装成 HTML 再发给浏览器，第一眼就能看到内容。
服务器上
数据已查好
模板已填充
HTML已拼装
同一时刻，两种首屏
01 · 先这样理解
把抽象概念放进真实场景
在服务器上先把页面拼装成 HTML 再发给浏览器，第一眼就能看到内容。
换个角度想SSR 像外卖送来的成品菜，到手就能吃；客户端渲染像送来一箱食材加菜谱，得自己下厨才有得吃。菜是同一道，差别在于在哪儿做。
02 · 点击演示
CSR 和 SSR，首屏差在哪？
突出显示的部分，就是当前概念在整条流程中负责的位置。
GET /blog
请求到达服务器
- 在服务器上完成
数据已查好模板已填充HTML已拼装 CSR · 还在拼 SSR · 已经能看 页面可见 ✓
交互部分 → 交给水合
1 / 4
Request · 浏览器请求页面
03 · 放进真实任务
什么时候会遇到它
内容站点
博客、文档、商品页：以内容为主的页面首选服务端渲染。
SEO 需要
搜索引擎抓到的是拼好的 HTML，收录更可靠。
弱网首屏
网络差的设备上，直出的 HTML 比等 JS 拼页面快得多。
04 · 想一想
用一个问题检查理解
同一个页面，CSR 版用户先盯两秒白屏，SSR 版立刻见到内容。省下的工作去哪了？
查看答案
没有消失，是搬家了：拼页面的活从用户的浏览器搬到了服务器。用户少等，代价是服务器每次请求都要干活——所以纯静态内容常再进一步，构建时就提前拼好（SSG）。
最容易踩的坑
SSR 不是万能药：每个请求都消耗服务器算力，页面「可见但未水合」时依然点不动。内容型页面收益最大，重交互的应用要权衡。