选一个模式，点「播放」，看时间轴一步步走：左边记「走到了哪一步 / 花了多久」，右边上半是「浏览器收到的 HTML 源码」，右下是「用户此刻看到的屏幕」。 一句话结论：SSR 更早让你看见，但点得动要等水合（hydrate）完成。
| 对比项 | CSR 纯客户端渲染 | SSR 服务端渲染 | SSG 构建时预渲染 |
|---|---|---|---|
| 首屏 HTML 里有正文吗 | 没有，只有一个空壳 <div id="app"> |
有，正文在响应里就写好了 | 有，但 HTML 是打包时就生成好的静态文件 |
| 线上要跑什么服务器 | 只需要静态文件服务（Nginx / CDN / OSS） | 要一个常驻 Node 进程（node .output/server/index.mjs） |
只需要静态文件服务 |
| SEO / 爬虫拿到什么 | 裸爬虫常只看到空壳，收录慢 | 每次请求都拿到完整正文，动态内容也新 | 拿到完整正文，最快最稳；但内容变了要重新构建 |
| 服务器成本 | 最低（纯静态） | 最高：每个访客都要跑一次组件渲染 | 低：静态托管 + CDN |
| 「看得见」的时机 | 最晚：JS 下载 + 执行 + 取数都做完之后 | 最早之一：HTML 一到就显示 | 最早：同 SSR，且不用等服务端现算 |
| 「点得动」的时机 | 和看得见同一时刻（同一次渲染顺带绑好事件） | 晚于看得见：还要下载 JS + 水合 | 晚于看得见：同样要水合 |
| 适合什么 | 登录后内网系统、对首屏和收录不敏感的后台 | 内容会变又要被收录的站点：商品详情、资讯、文档 | 基本不变的页面：落地页、博客归档、教程站 |