静态网站生成器将会成为下一个大热门

Matt Biilmann 是现代静态网站托管服务Netlify 的联合创始人兼CTO，在开发工具构建、内容管理系统和Web 基础架构方面有10 多年的经验。他从开源目录 StaticGen 及 GitHub 上发现，静态网站生成器发展迅速。像 Nest 和 MailChimp 这样专注于设计的公司现在就使用静态网站生成器构建他们的主要站点。 Vox Media 基于 Middleman 构建了一个完整的发布系统。 Carrot 使用自己的开源生成器 Roots 为一些世界上最知名的品牌创建网站。近日，Matt撰文分析了这一现象背后的原因，并预言静态网站生成器将成为下一个大热门。

像Dreamweaver 和FrontPage 这样的桌面应用程序，通过WYSIWYG 编辑器为构建以内容为驱动的网站提供了解决方案。网页被分成了导航栏、标题栏、页脚栏等可重用的部分。在某种程度上，这就是最早的静态网站生成器。但随着发展，这样的工具逐渐无法满足现代网站构建中设计与内容相分离的要求。于是，LAMP 技术栈及诸如 WordPress 、 Drupal 和 Joomla 这样的 CMS 成为主流，Web 进入 2.0 时代。用户不再只是跟随超链接浏览内容，而是可以订购产品、参与社区及创建内容。

但是，动态网站容易遭受蠕虫攻击。据保守估计，超过 70% 的 WordPress 部署容易因为已知漏洞遭受攻击（超过 23% 的 Web 网站以 WordPress 为基础构建）。而几个月前， 1200 万个 Drupal 站点需要紧急打补丁。此外，即使是最为优化的动态网站，其性能也无法同静态网站相比。并且，对于动态网站而言，缓存失效非常难以恢复，尤其是需要充分利用 CDN 的分布式缓存。WordPress 网站并不保证同一个 URL 不会返回不同的 HTML。跟踪页面缓存是否失效非常复杂。在这一点上，静态网站完全不同。它们遵循一个非常简单的缓存约定：在 URL 所对应的文件没有更新的情况下，任何 URL 都会返回相同的 HTML。

近年来，作为传统动态网站基础架构的替代方案，现代静态网站生成器日渐盛行。许多导致静态网站失败的限制已不复存在。现在，每周都会有新的静态网站生成器发布。通常，它们都有如下特点：

• 模板：允许将网站分解成布局组件和包含组件，以便消除重复，这是静态网站生成器的基本要素之一。

• 支持 Markdown：Markdown 的兴起是静态网站生成器流行的根本原因之一。所有主要的静态生成器都支持 Markdown，也有一些支持 reStruturedText 或其它标记格式。但通常，它们都允许内容开发人员以结构化的格式编写纯文本文档，保证了内容与设计的分离。

• 元数据：在文档顶部，通常采用 YAML 格式，如下所示： 标题：文档标题

  分类：类 A 类 B

  —

  # 具体内容

  文档正文

  这使得使用元数据为单个文档作注解非常简单。

• 资源管道：现在的前端开发几乎总是用到多种构建工具和编译器。大多数现代静态网站生成器都包含了一个资源管道，用于处理资源编译、转译、压缩和打包。

另外，静态网站生成器通常会提供一个命令行 UI，用于构建网站或运行本地服务器。例如， Jekyll 就提供了 jekyll build 命令。

Matt 认为，静态网站生成器技术现在之所以崛起，主要是因为如下几个原因：

• 浏览器发展：现代浏览器本身就是一个操作系统。它不再只是显示从 Web 上下载的文档，而是能够运行成熟的 Web 应用程序，过去许多需要动态代码的特性现在都可以移到客户端了。例如，可以使用 Disqus 、 Isso 添加评论功能，使用 Twitter 或 Facebook 的 JavaScript 组件集成社交应用，使用 Swiftype 添加搜索功能，等等。基于浏览器的网站插件越来越多，而使用 Ember.js、AngularJS 或 React 构建的现代 Web 应用通常也完全作为静态网站部署。
• CDN 成为主流：任何人都可以注册 Amazon AWS，并在网站前端设置 CloudFront 服务。 Fastly 、 MaxCDN 、 CloudFlare 等公司提供了小企业也用得起的 CDN 服务。虽然动态网站也能使用 CDN，但缓存失效是个棘手的问题，而静态网站很容易直接部署到 CDN，并可以直接从离用户近的本地缓存提供服务。
• 高性能不可或缺：越来越多的用户通过移动设备访问网站，网站性能变得前所未有的重要。移动设备不支持多任务，浏览网页时几乎无法做其它事，等待页面加载会格外让人沮丧。然而，动态网站无论如何优化，其性能也永远不如一个托管在 CDN 上的静态网站有保障。此外，静态网站生成减少了许多开发过程中需要考虑的性能问题，例如，无需考虑数据库查询的效率。
• 构建工具应用广泛：前端开发人员大量地使用构建工具、包管理器和各种编译器、转译器。Grunt 是第一个成为主流的前端构建工具，大多数新项目都有构建步骤。构建工具的普及使得静态网站生成器更自然地成为前端工具集的一部分。

但是，在成为主流之前，静态网站生成器还有一些工作要做。例如，初次选择一个静态网站生成器并开始一个项目非常困难，因为这涉及许多复杂的细节，而且这些工具及其文档都还有很大的改进空间。另外，静态网站生成器距离成熟的主流市场还很远，无法提供同传统动态网站平台一样的服务，最为明显的就是内容编辑。对前端开发人员而言，在文本编译器中直接使用 Markdown 进行编辑并发送到 GitHub 是个理想的工作流程，但对非技术出身的终端用户而言，这种方式并不友好。这是内容编辑同静态网站生成之间存在的一个巨大鸿沟。该问题不解决，静态网站生成就不会成为主流。

所幸，目前已经有一些“非 CMS”方案。例如，The Verge 就一直使用Google Sheets 作为Middleman 的内容层； StaticGen 将 Gist 和 GitHub API 当作数据库用；Carrot使用Contentful 作为一个静态CMS 。Matt 还提到了其它一些内容编辑解决方案，如 Prose.io 、N etlify 的开源 CMS ，感兴趣的读者可以进一步研究。

感谢郭蕾对本文的审校。

给InfoQ 中文站投稿或者参与内容翻译工作，请邮件至 editors@cn.infoq.com 。也欢迎大家通过新浪微博（ @InfoQ ， @丁晓昀），微信（微信号： InfoQChina ）关注我们，并与我们的编辑和其他读者朋友交流（欢迎加入 InfoQ 读者交流群）。