今年年初，我终于决定将自己的网站从基于 PHP 的 CMS 移植到基于 JavaScript 的静态网站生成器（SSG）了。原因如下：

1. 虽然一开始我是“全栈”开发人员，但现在我只负责前端工作：如果我需要编写自定义功能，那么能用 JavaScript 编写的代码我就不想用 PHP 来写。
2. 我不需要抽象层或 CMS 的复杂性——我最喜欢用 markdown 文件编写内容，并且希望永远不要再碰 Mysql 数据库或所见即所得编辑器。
3. 我想提高网站的性能：静态 HTML 文件在 99% 的时候都比动态页面更快。
4. 最后还有成本优势：LAMP stack 服务器得按月付费；Netlify 的免费套餐（每月构建 300 分钟）应该可以轻松覆盖零成本个人博客的需求。

当我决定使用静态站点生成器和 JavaScript（排除了 Jekyll 和 Hugo）后，就只剩下两个差别颇大的选项了。

“我听说 Gatsby 很好用”

根据官方网站的说法，“Gatsby 是一个基于 React 的免费开源框架，可帮助开发人员构建速度飞快的网站和应用”。它有一个由 GraphQL 支持的数据层，并将所有内容输出到静态文件，使你可以在几乎任何地方托管它。

当我第一次听说我可以编写 React 并使用这个很酷的 GraphQL 新玩意儿，同时还能输出不需要 JavaScript 的静态页面时，我很想尝试它一下。我是这么想的：“这听起来像是渐进增强，但用不着什么投入”。不幸的是，就像大多数听起来过于美好的事情一样，经过一些调查我发现它就是个坑。用户首次访问 Gatsby 网站时会发生这些事情：