静态站点生成(Static Site Generation,SSG)指的是:在构建阶段把所有页面算完,产出一个个 HTML 文件。 访客打开页面时,服务器要做的只是把文件发出去。
和另外两种做法的区别
| 做法 | 页面什么时候生成 | 服务器要不要算 | 典型场景 |
|---|---|---|---|
| 静态生成 SSG | 构建时,一次算完 | 不要 | 博客、文档、维基 |
| 服务端渲染 SSR | 每次请求时 | 要 | 登录后台、个性化内容 |
| 客户端渲染 CSR | 浏览器打开后 | 不要,但浏览器要算 | 交互型应用 |
为什么内容站适合静态
因为内容站的页面对所有人都一样。同一篇文章,无论谁来、什么时候来,看到的都是同一份 HTML。既然结果不变,就没有必要每次重算。
省下来的东西是连锁的:
- 服务器不用跑逻辑,最便宜的静态托管就能扛住流量。
- 没有数据库,就没有数据库被拖垮、被删库、密码泄露这一类风险。
- 构建产物是一堆文件,可以整个下载下来带走,不存在「迁移数据」这一步。
代价
静态不等于免费。要接受的限制:
- 改内容要重新构建。写完一篇要跑一次构建才会出现在线上。
- 不能按用户生成页面。需要登录态、购物车、实时数据的地方做不了,或者得另接一层服务。
- 构建时间随内容量增长。文章到几万篇时构建会变慢,需要拆分成增量构建。
对个人博客和维基来说,这几条基本碰不到。文章量远达不到构建变慢的量级,也没有个性化需求。
部署长什么样
构建一次,得到一个 dist/ 目录:
dist/
├── index.html
├── blog/
│ ├── index.html
│ ├── hello-world/index.html
│ └── page/2/index.html
├── pagefind/ <- 搜索索引
└── rss.xml
把这个目录整个上传到随便什么静态托管上就完事了。没有后端进程要启动,没有环境变量要配,没有运维要盯。
相关的几个词
- 增量构建:只重新生成变化过的页面,缩短构建时间。
- CDN:把静态文件复制到世界各地的机房,访客从最近的机房取。
- 缓存失效:文件更新后如何让 CDN 别再发旧版本。静态站常用「文件名带哈希」绕过这个问题。
一句话判断
如果你的页面「所有人都一样、不常变、不用登录」,静态生成几乎总是最省事的选择。