开启gzip与brotli优化网站速度

概述

使用压缩算法gzip与brotli来压缩站点数据是前端优化手段之一。 作用就是压缩数据体积，目的就是减少网络传输时间。本文详细整理了Gzip & Brotli的命令参数和一些注意事项，防止日后忘记，也可以回来脑补一下。网上文章比较喜欢称http_gzip_module为动态压缩，http_gzip_static_module为预压缩，这样子称呼，可能是想表达http_gzip_module适合动态文件压缩，http_gzip_static_module适合静态文件压缩，确实是这样，理解能力差的我，觉得这样不好理解，毕竟http_gzip_module都会对动静态文件进行压缩。所以我在这里称http_gzip_module为实时压缩（每次接收到请求时都会进行一次压缩，然后再发送），http_gzip_static_module为预先压缩（每次接收到请求时直接发送预先压缩好的 .gz 文件），好明显http_gzip_static_module模块是弥补http_gzip_module模块的不足。 brotli压缩率比gzip小，但brotli兼容的浏览器比gzip少，所以推荐同时开启gzip与brotli。 好了，不叽叽喳喳了！

（一）gzip & brotli 参数讲解

1-1、Gzip 实时压缩

Nginx官方说明：http_gzip_module

gzip on;
// (默认:off) 开启或关闭gzip。

gzip_buffers 4 16k;
// (默认:32 4k|16 8k) 设置用于处理请求压缩的缓冲区数量与大小，比如32 4K表示按照内存页(one memory page)大小以4K为单位（即一个系统中内存页为4K），申请32倍的内存空间。

gzip_min_length  1k;
// (默认:20) 设置被压缩最小长度，当值为0时，所有报文都进行压缩。

gzip_comp_level 4;
// (默认:1) 共 1 ~ 9 个压缩级别，级别越高压缩率越大，但压缩时间越长，消耗CPU也越大。

gzip_types text/plain text/css text/xml application/javascript application/x-javascript application/xml application/xml+rss application/ecmascript application/json image/svg+xml;
// 指定Mime-Type(互联网媒体类型)进行压缩，text/html类型始终被压缩。
// 可通过HTTP头字段Content-Type，获取该资源的媒体类型，也可以参考HTTP Content-type对照表。

gzip_disable "MSIE [1-6].(?!.*SV1)";
// 当Request Header(请求头)中的User-Agent字段匹配这条正则时，则禁用压缩。

#gzip_vary on;
// (默认:off) 是否设置响应头发送Vary: Accept-Encoding字段(可接受的内容编码方式)，vary头主要提供给代理服务器使用，根据Vary头做不同的处理，支持gzip请求的反向代理缓存服务器将返回gzip内容。

#gzip_http_version 1.0;
// (默认:1.1) 设置被压缩最低的HTTP协议版本。
// 设置1.0可解决CDN或代理只支持HTTP/1.0的问题。

#gzip_proxied expired no-cache no-store private auth;
// 该指令在Nginx作为代理时候起作用，是否压缩取决于请求头中的“Via”的请求头，指令可以同时指定多个不同的参数，根据请求头和响应头来决定是否对代理的请求进行压缩。
（1）off：对所有代理请求头，禁用压缩;
（2）expired：当响应头中包含过期时间时，启用压缩;
（3）no-cache：当响应头的Cache-Control字段包含no-cache时，启用压缩;
（4）no-store：当响应头的Cache-Control字段包含no-store时，启用压缩;
（5）private：当响应头的Cache-Control字段包含private时，启用压缩;
（6）no_last_modified：当响应头不包含Last-Modified字段时，启用压缩;
（7）no_etag：当响应头不包含ETag字段时，启用压缩;
（8）auth：当请求头包含Authorization字段时，启用压缩;
（9）any：对所有代理请求头，启用压缩。

1-2、Gzip_static 预先压缩

Nginx官方说明：http_gzip_static_module

gzip_static on;
// (on | off | always 默认:off) 
// on接收到请求时会到URL相同路径寻找 预先压缩 ”.gz”文件，如果存在直接发送.gz文件，否则进行 实时压缩 再发送出去，以下参数也被考虑在内：gzip_http_version，gzip_proxied，gzip_disable，gzip_vary。
// always所有情况下都会使用”.gz”文件，不去检查客户端是否支持它。如果磁盘上没有未被压缩的原文件可以配合ngx_http_gunzip_module模块来使用。

2-1、Brotli 实时压缩

GitHub库：ngx_brotli 注1：此模块需要自行编译安装 注2：brotli只支持https协议 注3：支持brotli压缩算法的浏览器

brotli on; 	
// (默认:off) 开启或关闭brotli。
    
brotli_comp_level 6;
// (默认:6) 共 0 ~ 11 个压缩级别，级别越高压缩率越大，但压缩时间越长，消耗CPU也越大。

brotli_min_length 20;
// (默认:20) 设置被压缩最小长度。

brotli_types text/plain text/css text/xml application/javascript application/x-javascript application/xml application/xml+rss application/ecmascript application/json image/svg+xml;
// 指定Mime-Type(互联网媒体类型)进行压缩，text/html类型始终被压缩，设置*时所有类型都压缩。

brotli_window 512k;
// 设置Brotli窗口size。可接受的值是1k，2k，4k，8k，16k， 32k，64k，128k，256k，512k，1m，2m，4m，8m和16m。


### 该参数已被弃用，忽略。
### brotli_buffers 16 8k;

2-2、Brotli_static 预先压缩

brotli_static always;
// 启用或禁用对带有.br 扩展名的预压缩文件的检查。使用always值时，在所有情况下都使用预压缩文件，而无需检查客户端是否支持它。

（二）使用说明

# 1.下载ngx_brotli
cd "/www/server" && git clone https://github.com/google/ngx_brotli.git

# 初始化本地配置文件
cd "ngx_brotli" && git submodule update --init

# 2-1.备份nginx.sh
cp   /www/server/panel/install/nginx.sh   /www/server/panel/install/nginx.sh_$(date +%F).bak

# 2-2.下载nginx.sh
cd /www/server/panel/install
rm -f nginx.sh
wget http://download.bt.cn/install/0/nginx.sh 

# 3.编辑/www/server/panel/install/nginx.sh，查找--user=www 并在后面添加--add-module=/www/server/ngx_brotli
sed -i 's/--user=www/--user=www --add-module=\/www\/server\/ngx_brotli/'   /www/server/panel/install/nginx.sh

# 4-1.查找nginx版本号  例：nginx version: nginx/1.17.10
nginx -V

# 4-2.执行编译
sh /www/server/panel/install/nginx.sh install 1.17

# 5.通过grep命令查找http_gzip_static_module & ngx_brotli模块是否已安装
nginx -V 2>&1 | tr ' '  '\n' | grep -E "http_gzip_static_module|ngx_brotli"


gzip & brotli同时开启后的优先级：brotli_static > gzip_static > brotli > gzip

打开Chrome开发者工具

查询Response Header(响应头)验证gzip & brotli 是否成功开启
* 不带W证明预压缩开启成功

预先压缩好的文件

* js结尾为原始文件
* br结尾为brotli预压缩文件
* gz结尾为gzip预压缩文件