静态站点生成器 Static Site Generator

静态站点生成器综合了标记语言,比如Markdown或reStructuredText,和模板引擎比如Jinja,用于生成HTML文件。HTML文件能被web服务器或CDN支持而不需要任何依赖于WSGI server.

为什么静态站点生成器?

静态内容比如HTML,CSS和JavaScript文件能通过CDN分发且费用低廉。如果静态网站有大量同时流量进入,能被CDN分流而不影响链接。

比如,下图的网站由CDN分流,即使有近400个同时链接也能正常运作。

Example of how static websites scale with a CDN based on Full Stack Python on Hacker News front page traffic.

静态站点生成器如何工作?

静态站点生成器允许开发者通过写标记语言和模板文件来生成HTML文件,然后站点合并标记语言和模板,创建HTML。产生的HTML文件不需要手工维护,每次修改标记语言和模板时,HTML文件都会相应修改。

如下图,Pelican静态站点生成器将reStructuredText文件和Jinja2模板文件作为输入,整合生成静态的HTML文件。

Example of how static site generators work with a markup language and templates.

使用静态站点生成器的不足?

主要不足是站点生成后,其中的代码不能被执行(因为是静态的)。

被数据库支持的数据,比如评论,sessions等,只能通过第三方服务支持。如果你现在一个静态网站上使用评论,你需要嵌入embed Disqus’s form并完全依赖他们的服务。

很多web应用无法只使用一个静态网站。但是,一个静态网站生成器可以生成一个web应用的部分,剩余动态的部分由WSGI服务器提供。如果整合恰当,这样的网站的性能,会由于完全由WSGI服务器产生内容的网站。

Python实现

许多编程语言都有静态站点生成器的实现方式。下面是一些主要由Python代码实现的例子:

  • Pelican 是一个常用的Python静态站点生成器。主要模板引擎是Jinja,Markdown,reStructuredText and AsciiDoc。
  • Lektor 是一个静态内容管理系统和静态站点生成器,它使用Jinja作为模板引擎。
  • MkDocs
  • Nikola (source code) 整合了reStructuredText,Markdown或Jupyter (IPython) Notebooks,以Mako或Jinja2模板生产静态站点。
  • Acrylamid (source code) uses incremental builds to generate static sites faster than recreating every page after each change is made to the input files.
  • Hyde (source code) started out as a Python rewrite of the popular Ruby-based Jekyll static site generator. Today the project has moved past those “clone Jekyll” origins. Hyde supports Jinja as well as other templating languages and places more emphasis on metadata within the markup files to instruct the generator how to produce the output files. Check out the Hyde-powered websites page to see live examples created with Hyde.
  • Grow SDK (source code) uses projects, known as pods, which contain a specific file and directory structure so the site can be generated. The project remains in the “experimental” phase.
  • Complexity (source code) is a site generator for users who like to work in HTML. It uses HTML for templating but has some functionality from Jinja for inheritance. Works with Python 2.6+, 3.3+ and PyPy.
  • Cactus (source code) uses the Django templating engine that was originally built with front-end designers in mind. It works with both Python 2.x and 3.x.

开源静态站点生成器案例

静态站点生成器资源

Static site generators can be implemented in any programming language. The following resources either are general to any programming ecosystem or provide a unique angle on how to use a static site generator.

  • Static vs Dynamic Websites does an excellent job of showing the differences between a dynamic website that uses a database backend to produce content in response to a request compared with static sites that are pregenerated. There is also a second part in the series where generic static site generator concepts are explained.
  • Staticgen lists static website generators of all programming languages sorted by various attributes such as the number of GitHub stars, forks and issues.
  • The title is a big grandiose, but there’s some solid detail in this article on why static website generators are the next big thing. I’d argue static website generators have been big for a long time now.
  • Static site generators can be used for a range of websites from side projects up to big sites. This blog post by WeWork on why they use a static site generator explains it from the perspective of a large business.
  • Ditching WordPress and becoming one of the cool kids is one developer’s experience moving away from WordPress and onto Pelican with reStructuredText for his personal blog.
  • Static websites with Flask explains how to use Flask-Frozen to generate a static site based on content from the web framework and a data source backend. This approach is an alternative to using a purpose-built static website generator such as Pelican, Lektor or MkDocs.

静态网站部署资源

Deploying a static site is far less complicated than a traditional web application deployment, but you still need to host the files somewhere accessible. You’ll also to set up DNS to point a domain name to your site as well as provide HTTPS support. These guides walk through various ways of handling the static site deployment.

  • Randall Degges’ Ultimate Guide to Deploying Static Sites to Amazon Web Services walks through all the steps you need to get your site up and running on S3. The guide also shows how to set up SSL certificates to ensure your site can be loaded via HTTPS.
  • Deploying a Static Site on AWS, with S3 and CloudFront provides a really nice tutorial with screenshots to get any type of static site configured on AWS using S3 and Cloudfront.
  • Static site hosting with S3 and Cloudflare shows how to set up an S3 bucket with Cloudflare in front as a CDN that serves the content with HTTPS. You should be able to accomplish roughly the same situation with Amazon Cloudfront, but as a Cloudflare user I like their service for these static site configurations.
  • Google Cloud provides a tutorial on how to use them to host your static site. Note that you cannot currently use HTTPS on Google Storage servers, which is a huge downside.