为什么使用gzip

• 提升网站加载速度。Gzip 是一种服务器端的压缩技术，能显著减少网页传输的数据量，提高网站加载速度，还能有效减少带宽消耗。
• 在浏览自己的网站时，发现首次浏览速度有点慢，有几个较大的js文件，加载时间超过了20秒，这时间太长了，等不了。

gzip的适用场景

适合启用 gzip 的场景

• gzip 非常适合用于压缩文本资源，对于文本的压缩率很高。下面这些使用gzip压缩效果都不错。
  • HTML
  • CSS
  • JavaScript
  • JSON
  • XML

不适合启用 Gzip 的场景

• 对于已压缩的文件类型（如 JPEG、PNG、MP4、PDF 等），再次压缩效果甚微且浪费资源。
• 文件小于 1 KB 时，压缩的时间成本可能超过节省的带宽。

nginx 配置 Gzip

nginx 配置：

gzip on;
gzip_types text/plain text/css application/javascript application/json application/xml text/xml;
gzip_min_length 1024;
gzip_vary on;
gzip_proxied any;
gzip_buffers 16 8k;
gzip_comp_level 6;
gzip_disable "msie6";

配置解释

• gzip_types 指定需要压缩的文件类型
• gzip_min_length 仅压缩大于 1 KB 的文件
• gzip_comp_level 设置压缩级别，1-9 之间推荐值为 6，平衡压缩率和 CPU 使用
• gzip_vary 允许代理缓存 Gzip 压缩的内容。
• gzip_buffers 16 8k 一般默认配置是 32 4k 或者16 8k

验证 Gzip 是否生效

可以通过浏览器开发者工具查看 Content-Encoding: gzip 响应头，或使用 curl 命令：

curl -H "Accept-Encoding: gzip" -I https://daogu.work

可以看到显示的结果，最后有提示gzip
shell HTTP/2 200  server: nginx/1.22.1 date: Thu, 21 Nov 2024 10:02:26 GMT ...省略中 content-encoding: gzip

进阶优化

• 对于更高的压缩率，可以结合 Brotli 压缩。一般的nginx没有带brotli模块，有的通过安装nginx-extras能使用，但更多的是要连同nginx一起编译然后使用，有点麻烦。
• CDN（如 Cloudflare）也支持 Gzip 和 Brotli，能进一步提升性能。

参考链接

1. nginx关于gzip配置的说明
2. 我是如何把个人网站首屏加载时间从18秒优化到5秒的