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

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、Netlify的开源CMS，感兴趣的读者可以进一步研究。

\\

---

感谢郭蕾对本文的审校。

\

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