我压缩了这个网站上的所有 HTML 文件——删除了不必要的空格、整理了属性、优化了 HTML 实体等等。这使得每个页面都变得更小，理论上网站速度应该会略快一些。
我不会假装这一步在数据上是合理的。在压缩之前，我的页面就已经很小了，而压缩后的平均页面大小只减少了大约 4%。6 月份，压缩后节省的带宽可能还不到 1MB。
但我还是会这么做。我压缩 HTML 文件是因为我喜欢修改网站，也喜欢想办法让它更快更高效。最近我改变了压缩 HTML 的方法，觉得现在是时候比较一下我用过的三种方法，并分享一些我在这个过程中学到的 HTML 知识了。
我使用Jekyll构建了这个网站，所以我一直在寻找基于 Jekyll 或 Ruby 的解决方案。
目录
方法 #1：在 Jekyll 中压缩 HTML ，作者 Anatol Broder
这是一个压缩 HTML 的 Jekyll 布局。它是一个用纯Liquid （Jekyll 使用的模板语言）编写的单个 HTML 文件。
首先，将 HTML 文件保存为_layouts/compress.html ，然后在最高级别的布局中引用它。例如，在_layouts/default.html中，你可以这样写：
--- layout: compress --- <html> </html>因为它是一个 HTML 文件，所以很容易安装，而且不需要任何插件。如果你在插件被限制或禁止的环境中运行（我认为包括--- layout: compress --- <html> </html>
GitHub Pages ，尽管我不是 100% 确定）。
缺点是单个 HTML 文件可能难以调试，它只能最小化 HTML（而不是 CSS 或 JavaScript），并且没有简单的方法来缓存输出。
方法#2： htmlcompressor gem ，作者：Paolo Chiodi
htmlcompressor gem是Google 基于 Java 的 HtmlCompressor的 Ruby 移植版。README 文件将其描述为“alpha 版本”，但在我的实际使用中，它非常稳定，并且 API 也很简单。
我首先更改compress.html布局以将页面内容传递给compress_html过滤器：
--- ---该过滤器定义为--- ---
自定义插件；我将以下代码保存在_plugins/compress_html.rb中：
def run_compress_html ( html ) require 'htmlcompressor' options = { remove_intertag_spaces: true } compressor = HtmlCompressor :: Compressor . new ( options ) compressor . compress ( html ) end module Jekyll module CompressHtmlFilter def compress_html ( html ) cache = Jekyll :: Cache . new ( 'CompressHtml' ) cache . getset ( html ) do run_compress_html ( html ) end end end end Liquid :: Template . register_filter ( Jekyll :: CompressHtmlFilter )我基本都使用默认选项；唯一启用的额外规则是删除标签间的空格。请考虑以下示例：def run_compress_html ( html ) require 'htmlcompressor' options = { remove_intertag_spaces: true } compressor = HtmlCompressor :: Compressor . new ( options ) compressor . compress ( html ) end module Jekyll module CompressHtmlFilter def compress_html ( html ) cache = Jekyll :: Cache . new ( 'CompressHtml' ) cache . getset ( html ) do run_compress_html ( html ) end end end end Liquid :: Template . register_filter ( Jekyll :: CompressHtmlFilter )
默认情况下，htmlcompressor 会在结束<p> hello world </p> <p> my name is Alex </p>
</p>和开头的<p>保持原样。启用remove_intertag_spaces会使其更具侵略性，它会删除该空格。
我正在使用Jekyll 缓存来保存压缩的结果——大多数页面在构建过程中不会发生变化，并且缓存结果比每次重新压缩 HTML 更快。
该 gem 似乎已被废弃——最后一次推送到 GitHub 是在 2017 年。
方法 #3： minify-html 库（作者：Wilson Lin）
这是一款基于 Rust 的 HTML 压缩工具，支持多种语言，包括 Ruby、Python 和 Node。它速度非常快，甚至比其他压缩工具更强大。
我使用它的方式和htmlcompressor非常相似。我在_layouts/compress.html中调用了相同的compress_html过滤器，然后在_plugins/compress_html.rb中运行run_compress_html略有不同：
def run_compress_html ( html ) require 'minify_html' options = { keep_html_and_head_opening_tags: true , keep_closing_tags: true , minify_css: true , minify_js: true } minify_html ( html , options ) end这是一个更激进的压缩工具。例如，def run_compress_html ( html ) require 'minify_html' options = { keep_html_and_head_opening_tags: true , keep_closing_tags: true , minify_css: true , minify_js: true } minify_html ( html , options ) end
<html>和<head>元素在 HTML5 文档中是可选的，因此此压缩器会尽可能地删除它们。我已禁用此功能，因为我比较传统，喜欢我的页面包含<html>和<head>标签。
这个库还支持压缩内联 CSS 和 JavaScript，这倒是个不错的功能。不过，它还有一些不足之处： JS 压缩方面存在一个未解决的问题，我不得不调整几个 if-else 语句才能让它兼容这个压缩器。GitHub 仓库上的活动比较零散，所以我不知道这个问题近期是否会得到修复。
最小化，但验证
在我缩小 HTML 之后，但在发布网站之前，我运行HTML-Proofer 来验证我的 HTML 。
我不确定这是否能发现由 minifer 引入的问题，但它让我安心，因为这些工具不会破坏我的 HTML。（它已经发现了很多由我的错误引起的问题！）
比较三种方法
HTML 压缩器有两个关键指标：
-
速度：两者旗鼓相当。当我使用热缓存构建网站时，无论使用哪种压缩工具，大约需要 2.5 秒。如果使用冷缓存，
htmlcompressorgem 和minify-html库会慢很多，但这只是多花几秒钟而已，而且我很少用这种方式构建网站。 -
文件大小：基于 Ruby 和 Rust 的压缩工具压缩效果略好一些，因为它们在精简内容方面更加激进。例如，它们会更智能地删除不必要的空格以及在属性值周围添加引号。
这是缩小后的平均页面大小：
方法 平均 HTML 页面大小 无需缩小 14.9 KiB 在 Jekyll 3.2.0 中压缩 HTML 14.3 KiB htmlcompressor 0.4.0 14.0 KiB minify-html 0.16.4 13.5 KiB
我目前正在使用 minify-html。部分原因是它可以稍微缩小页面尺寸，部分原因是它支持其他语言。这个网站是我唯一一个使用 Ruby 的主要项目，所以我一直渴望找到可以与其他非 Ruby 项目分享的内容。如果 minify-html 对我有用（目前为止确实如此），我可以想象在其他地方使用它。
[如果这篇文章的格式在你的阅读器中看起来很奇怪，请访问原始文章]