一种优于 gzip 的压缩方式 Brotli

Brotli 是一种新标准，它提供比 gzip 更好的压缩 - 现在主要浏览器都支持它。

检查互联网上的前 1000 个 URL，brotli 性能为：

• 比 JavaScript 的 gzip 小 14%

• 比 HTML 的 gzip 小 21%

• CSS 比 gzip 小 17%

第一条确实足够吸引人，特别是现代 WEB 应用通常有很大的 JavaScript 文件。

虽然没有像 HTTP/2 的多路复用那样对 WEB 性能有很大的帮助，但对于少量的工作来说，它仍然是一个不错的速度优势。而且它是个不错的兼容方式：使用过时浏览器的访问者仍然可以获得常规的旧 gzip 压缩资源。

让 brotli 运行并不难，但有几个地方可能会出错，主要是因为它们包含一个巨大的谎言：Brotli 的压缩速度比 gzip 慢，因此不能将其用于动态内容。

这里列出了将 brotli 添加到站点时的需要注意的事项。

Brotli 可以比 gzip 压缩得更快，并且仍然可以生成更小的文件

可以用一个文件来测试一下速度：

time brotli --input input.js --output input.js.brtime gzip input.js

第一个命令将花费比第二个更长的时间，这可能会产生误导：gzip 和 brotli 都具有不同的压缩级别，默认情况下该 brotli 命令已调至最大的压缩级别。

当把压缩级别设置为 4 的时候， Brotli 比 gzip 小得多并且压缩速度更快。

可以在 Brotli 部署中使用这一经验值，例如，对于 nginx 来说：

• 静态资源，用 11 来压缩预压缩文件，这样可以立即为每个请求提供这些文件。

• 动态内容，使用 4，它仍然会产生更小的响应，但比在更高设置下的 gzip 或 brotli 压缩所需的时间更少。这样，浏览器只需要等待压缩响应很短的时间。

Brotli 为每个模块提供：

• brotli_filter 即时压缩响应，就像 gzip
  

• brotli_static 提供预先创建 .br 的文件版本，这意味着必须 brotli 在部署过程中使用命令创建文件。

要将模块加载到 nginx，load_module 请在 nginx.conf 的顶级块中添加指令：

# Compress responses on-the-fly.load_module modules/ngx_http_brotli_filter_module.so;# Serve pre-compressed files.# Both modules could be used separatelyload_module modules/ngx_http_brotli_static_module.so;

然后在配置文件中添加如下配置：

brotli on;brotli_comp_level 4;brotli_types text/plain text/css application/javascript application/json image/svg+xml application/xml+rss;brotli_static on;

重启 nginx：

sudo systemctl restart nginx

Brotli 并非适用于所有文件类型，二进制文件，如 JPEG、PNG、MP4，已经用特定格式的压缩进行了压缩，其性能优于普通的 gzip 和 brotli 压缩。使用gzip 或 brotli 压缩 PNG 是没有意义的，因为 PNG 已经被压缩了，它会变得更大而不是更小。以下 text/plain text/css application/javascript application/json image/svg+xml application/xml+rss，涵盖 HTML、纯文本、JavaScript、JSON、SVG 和 RSS。

检查是否有效，在 Chrome 中，启动开发人员工具并单击网络选项卡。

单击网络请求 JS、HTML 或 SVG 文件，应该在请求标头中看到 Accept-Encoding: br，在响应中看到 Content-Encoding: br，这就意味着生效了。

使用 Brotli，可以将 JS 包的性能提高 17%。