让 CloudFlare 支持 Brotli 压缩算法 11 级压缩比，更节流！

站长们应该都知道 Brotli 压缩算法吧，这是一种通用的无损压缩算法。它结合使用 LZ77 算法的一个现代变体（Lempel-Ziv 编码）、霍夫曼编码和二阶上下文建模来压缩数据，提供了与当前最佳通用压缩方法相媲美的压缩比。2015 年 9 月谷歌发布了 Brotli 压缩算法，直到现在才开始被大多数的浏览器所兼容。特别是 HTML、CSS 和 JavaScript 的常用术语，能够将数据比 gzip, bzip2, LZMA 等压缩算法的基础上进一步进行压缩，减少了数据内容的容量大小，使得网页在加载时速度更快。主流的 HTTP 服务器程序 Apache 和 Nginx 也很早就支持了 Brotli 压缩算法，明月自己在 Nginx 上用 Brotli 压缩算法也有六年多了（可参考【给 Nginx 添加谷歌 Brotli 压缩算法支持】一文）。

最近明月把 Brotli 压缩算法设定为了“首选”网页压缩算法，实现起来其实也很简单，只需要在nginx.conf文件里调整Brotli和Gzip语句先后位置即可，如下代码所示：

        brotli on;
        brotli_window 512k;# Brotli 使用的窗口值。默认值为 512k
        brotli_comp_level 6;# 压缩水平可以是 0 到 11，默认值是 6。太高的压缩水平对性能提升并没有太大好处，因为这需要更多的 CPU 时间
        brotli_window 512k;# Brotli 使用的窗口值。默认值为 512k
        brotli_comp_level 11;# 压缩水平可以是 0 到 11，默认值是 6。太高的压缩水平对性能提升并没有太大好处，因为这需要更多的 CPU 时间
        brotli_types application/dash+xml application/eot application/font application/font-sfnt application/javascript application/json application/opentype application/otf application/pkcs7-mime application/protobuf application/rss+xml application/truetype application/ttf application/vnd.apple.mpegurl application/vnd.mapbox-vector-tile application/vnd.ms-fontobject application/xhtml+xml application/xml application/x-font-opentype application/x-font-truetype application/x-font-ttf application/x-httpd-cgi application/x-javascript application/x-mpegurl application/x-opentype application/x-otf application/x-perl application/x-ttf font/eot font/opentype font/otf font/ttf image/svg+xml text/css text/csv text/javascript text/js text/plain text/richtext text/tab-separated-values text/xml text/x-component text/x-java-source text/x-script;# 指定允许进行压缩的回复类型
        brotli_static always;# 是否允许查找预处理好的、以 .br 结尾的压缩文件。可选值为 on、off、always
        gzip on;
        gzip_min_length  1k;
        gzip_buffers     4 16k;
        gzip_http_version 1.1;
        gzip_comp_level 2;
        gzip_types     text/plain application/javascript application/x-javascript text/javascript text/css application/xml application/xml+rss;
        gzip_vary on;
        gzip_proxied   expired no-cache no-store private auth;
        gzip_disable   "MSIE [1-6]\.";

然后保存，重启 Nginx，网页载入时压缩算法选择顺序就是：Brotli=>Gzip 了，毕竟目前几乎所有的主流浏览器都已经支持 Brotli 压缩算法了嘛！

CloudFlare 默认是支持 Brotli 压缩算法的，只需要在 CloudFlare 后台【速度】——【优化】——【内容优化】里开启即可，如下图：

但是 CloudFlare 默认支持的 Brotli 压缩等级是默认 6 级的，现在的云服务器 CPU 算力完全是可以用 11 级的，更高级的压缩等级带来的好处不言而喻，网页越小自然载入速度就越快了，CloudFlare 上缓存好这些 11 级压缩过的文件就是刚需了。

看看这个个 CSS 文件被 Brotli 压缩后的压缩比

我们在服务器 Nginx 里调整 Brotli 压缩等级为 11 后，只需要在 CloudFlare 里【规则】——【Configuration Rules】里创建一个规则就可以让 CloudFlare 支持服务器上的 11 级 Brotli 压缩文件了：

(ends_with(http.request.uri.path, ".css")) or (ends_with(http.request.uri.path, ".js"))

CloudFlare 规则表达式（可以复制粘贴到 CloudFlare 里直接引用哦！）

然后确保如下图所示的开关选项都是“关闭”的：

具体就是关闭【自动 HTTPS 重写】、【Auto Minify】勾选 CSS、JS 以及【电子邮件混淆】、【Rocket Loader】、【服务器端排除】这几项，然后【部署】为第一条【Configuration Rules】规则即可。记得最后清除一下 CloudFlare 上的缓存，让 CloudFlare 节点 IP 重新回服务器获得 Brotli 压缩等级 11 的压缩文件。

最后，可以到【Check Gzip/Brotli Compression】里输入网页或者网页 CSS、JS 文件地址进行 Brotli 压缩比结果测试了。

CloudFlare 免费版在处理小文件的缓存时候国内延迟是最低的，所以 Brotli 压缩的越小就越好，国内站推荐大家试试，具体效果可能会有差异，但境外测速网站评分一定会有上涨的。