静态网站生成器有哪些

静态网站相比对是动态网站，而动态网站则不用说了，目前互联网各大平台可以说都是属于动态网站类型。用户基数大，总是要考虑运营的，而用户运营是运营必不可少的一环节。

静态网站的交互性过于薄弱，因此不适合构建大型网站。更适合官方文档，企业网站，或者喜欢“极客”风的个人博客用户。而优点则是安全性好，加载速度快，有多大流量就能撑起多少用户。

因事先生成好html相关文件，所以不用担心数据查询等问题导致的性能瓶颈。要事先生成好这些html页面文件，就得有静态网站生成器（Static site generators 缩写 SSG）这样的工具。

就用户基数比较大的有Hexo，Hugo，Gatsby，Vuepress，Jekyll。另外还有Pelican，Metalsmith，Octopress，Pelican，Middleman，DocPad，Wintersmith，Cactus，HubPress，MkDocs，Docsify等，实在太多了，根据数不过来。

名字中带Doc的适合的的场景也很明显，适合有较为明显的层级展现关系的，比如书籍，应用文档之类的。

Hexo

我最开始接触静态网站就是Hexo，但最后网站上线用的却是Hugo。衡量用户的多少，用百度指数，谷歌趋势都不够直观的看到数据。

因此，我们就看看Github上的stars数量吧。

Stars 数量：31K
官网：https://Hexo.io/zh-cn/
Hexo Github：https://github.com/Hexojs/Hexo

跟Hugo相比，Hexo的生成速度实在不是一个数量级的。根据Hexo核心成员的说法，Benchmark数据是300篇文章15s，1000篇文章45s。

毕竟说的是基准数据，我自己直接体验是155篇文章，用时35s，从敲下Hexo g命令后开始计时一直到完成，总共35秒，总共字数是486.4K字。

我用的是Hexo4.2.1（hexo-cli: 3.1.0）的版本，看官网动态，Hexo5.0速度又有小幅度提升，到时候我在看看同样的文章，同样安装了搜索插件，sitemap等插件看看同时多少。

8月10日更新为hexo5.0.2（hexo-cli: 4.2.0）用时比之前快了2~3秒。

hexo与hexo-cli的区别是hexo-cli创建工程后就由hexo模块复制静态页面的生成预览之类的工作。CLI = Command Line Interface 命令行界面

Hugo

很多人都说Hugo的速度独步天下，确实也是这么回事，跟Hexo相比对，Hugo同样的文章字数，不到1s就搞定。

说Hugo的速度和Hexo不在一个数量级上，看来并不冤枉。最开始接触这类静态网页生成器的时候，对Hugo印象好不是因为速度快，那时候也没什么文章，所以速度体现不出来，就差几秒而已。

给我印象最深的是Hugo只需一个二进制文件即可搞定这一些，让我觉得非常干净，而且容易上手。不像Hexo还要npm一堆东西才能用。不过缺陷也很明显，功能性的东西需要一定的动手能力，不如Hexo能够安装插件解决来的便利。

Stars 数量：45.9K
官网：https://goHugo.io
Hugo Github：https://github.com/goHugoio/Hugo

我一直以为用Hugo的人少，看来是中文用户中用Hugo的人少，看Stars的数量比Hexo高出不少呢。所以这就带来一个问题，如果只是喜欢静态网站而不是专业的程序员，应当说Hexo对中文用户支持更友好，毕竟开发出Hexo的就是台湾人。

构建一个博客，刚开始少不了换主题，而hugo很多的主题都是外国人开发的，如果看中了某款主题，还需自己“汉化”后才能使用。对比而言，Hexo有着丰富的中文主题，这一点是其他所有都不能与之比拟的优势。

VuePress

VuePress是VUE来驱动的（还有Nuxt），而VUE则是前端三大框架（Angular、React、Vue）之一。严格意义上说，我最初折腾的就是VuePress，是因为折腾一次失败了，才转向Hexo，从而发现了Hugo。

因此，我对VuePress没什么太大的感触，唯一的感触就是对新手上手难度可能比Hexo，Hugo大些。现在好些了，一搜有不少VuePress的教程，之前就只有2篇，翻来覆去就那么2篇VuePress的相关教程。过了一年，下载了些主题再次试了下Vuepress，渲染速度不比Hexo快，初步印象觉得有些笨重，可能也是因为习惯了Hexo的方式，对Vuepress不大好理解。

Stars 数量：17.1K
官网：https://vuepress.vuejs.org/zh/
VuePress Github：https://github.com/vuejs/vuepress

主题不多，就官网默认的那一款主题我都还蛮喜欢的，也正因为如此，所以一开始就从VuePress下手折腾。

而且具有SPA（单页应用），一次加载好所需的文件，切换其他页面由JS应用代码直接请求渲染，无需整体刷新。，体验起来，速度倒是挺不错的。但也因为是这种原因，所以文章越多，JS脚本也越多，那生成的文件也越多，体积也会稍稍变大。

Gatsby

Stars 数量：46.3K
官网：https://www.gatsbyjs.org/
Gatsby Github：https://github.com/gatsbyjs/gatsby

看到比Hexo，Hugo都还高的Stars数量，是挺出乎我这个外行人的意料。因为看见用Gatsby搭建的博客确实不多，至少在我浏览的印象中，Hexo是排第一的，其次是Hugo。

如果你是搞React的就非常适合用了，或者说用React框架的人都用Gatsby的多。而且功能非常强大，丰富的插件系统可以让你从CMS，SaaS服务，数据库以及API等渠道拉去数据。（它应该与Next.js做比对）

它的功能强大，但来的的问题是依赖也挺多的，属于重量级别的。没有一定编程基础的人，非常不建议使用Gatsby。对于一个博客，能有自己的内容输出是为首要，而至于用什么搭建，这些只是用来实现的工具罢了。

但很多刚开时折腾网站或者博客的人，包括我，都是喜欢先折腾一把用什么工具搭建，是WordPress还是Typecho，还是Ghost，然后转向静态网站了还是想着到底是Hexo，还是Hugo。

选定好工具后，又开始折腾主题，这几乎是每一个人的必经之路。

Jekyll

Jekyll这个工具我从未使用过，不大了解，要不是把Hexo生成好的站点托管在Github pages上，我都不知道有这个工具。因Jekyll由Ruby构建，并且集成到了Github Pages中。

如果你是WordPress用户，想尝试静态网站，而Jekyll则可以通过importer来做这些事（hexo也有类似插件）。当然，强大的WordPress生态系统也有专门用来全站静态化的插件来实现网站静态化。

Stars 数量：41K
官网：https://jekyllrb.com/
Jekyll Github：https://github.com/jekyll/jekyll

看来偏见无处不在，我一直以为Hexo是拥有最多的静态网站用户群体数，可从Github Stars数量来衡量的话，Hexo不但不能屈居第二，反倒是倒数第二。

又再一次出乎我的意料，只能说环境和接触面决定了你的眼界和认识。这段时间忽然重视起博客来，就写了几篇文章，未来相信会有一段时间，又要停更很久了吧。

不折腾，就没有东西可写，这话倒是不假。

如果想了解更多的静态站点和GitHub Stars可参见https://www.staticgen.com，StaticGen是专业对开源静态网站生成器所做的排行榜。想了解前端生态圈的对比可以翻阅https://risingstars.js.org/

现在是9月11日，距离统计时间刚好过了一个月零三天时间，发现Hugo增长速度最快，由45.9K→46.5K，其实是Gatsby由46.3K→46.8K，其余则都是增长0.2K，看来Hugo势头强劲，简洁且生成速度快赢得不少人的青睐。

间接解决Hexo生成慢的问题

Hexo生成文章慢是因为执行了hexo g命令后不能马上有结果，需要一个过程，几秒到几十秒不等，而这个时候你就需得等到它执行完毕才能执行下一条命令。

如果我们把这个过程放到云端去处理，比如我都是直接把文章push到Coding上，然后再让Coding自动push给github，最后触发Github Actions来处理完成后推送到Github Pages上。而这一过程都是全自动，在本地写好脚本双击一次执行git push，然后就让他在云端处理好了。如果你不是那种写完文章后立马就要自己看一遍的话，可以说这是Hexo较为完美的解决方案。

至于如何完成这两步，可分别参考《Coding持续集成自动同步到GitHub》和《Github Actions自动部署Hexo博客》这两篇文章。其他如Hugo，VuePress等也可以这么用，区别大概就是Actions脚本的不同罢了。

文章作者: 唐瑞平
文章链接: https://www.tangruiping.com/post/hexo-hugo-vuepress-gatsby.html
版权声明: 本文转载自 CC BY-NC-SA 4.0 许可协议。