搜索博客与维基

技术/架构

静态站点生成

在构建阶段把内容变成纯 HTML,服务器只发文件,不做计算。

2 分钟阅读别名:SSG、Static Site Generation

静态站点生成(Static Site Generation,SSG)指的是:在构建阶段把所有页面算完,产出一个个 HTML 文件。 访客打开页面时,服务器要做的只是把文件发出去。

和另外两种做法的区别

做法页面什么时候生成服务器要不要算典型场景
静态生成 SSG构建时,一次算完不要博客、文档、维基
服务端渲染 SSR每次请求时要登录后台、个性化内容
客户端渲染 CSR浏览器打开后不要,但浏览器要算交互型应用

为什么内容站适合静态

因为内容站的页面对所有人都一样。同一篇文章,无论谁来、什么时候来,看到的都是同一份 HTML。既然结果不变,就没有必要每次重算。

省下来的东西是连锁的:

  1. 服务器不用跑逻辑,最便宜的静态托管就能扛住流量。
  2. 没有数据库,就没有数据库被拖垮、被删库、密码泄露这一类风险。
  3. 构建产物是一堆文件,可以整个下载下来带走,不存在「迁移数据」这一步。

代价

静态不等于免费。要接受的限制:

  • 改内容要重新构建。写完一篇要跑一次构建才会出现在线上。
  • 不能按用户生成页面。需要登录态、购物车、实时数据的地方做不了,或者得另接一层服务。
  • 构建时间随内容量增长。文章到几万篇时构建会变慢,需要拆分成增量构建。

对个人博客和维基来说,这几条基本碰不到。文章量远达不到构建变慢的量级,也没有个性化需求。

部署长什么样

构建一次,得到一个 dist/ 目录:

dist/
├── index.html
├── blog/
│   ├── index.html
│   ├── hello-world/index.html
│   └── page/2/index.html
├── pagefind/          <- 搜索索引
└── rss.xml

把这个目录整个上传到随便什么静态托管上就完事了。没有后端进程要启动,没有环境变量要配,没有运维要盯。

相关的几个词

  • 增量构建:只重新生成变化过的页面,缩短构建时间。
  • CDN:把静态文件复制到世界各地的机房,访客从最近的机房取。
  • 缓存失效:文件更新后如何让 CDN 别再发旧版本。静态站常用「文件名带哈希」绕过这个问题。

一句话判断

如果你的页面「所有人都一样、不常变、不用登录」,静态生成几乎总是最省事的选择。