Nginx开启gzip和静态资源缓存：两条配置让PageSpeed涨30分

来源：互联网时间：2026-09-11

网站上线第一天，用 PageSpeed Insights 跑了一遍，三个提示排在最前面：启用文本压缩、静态资源未设置缓存策略、传输资源过大。这三项背后其实是同一个问题——Nginx 只是老老实实把文件原样发出去，既没压缩，也没告诉浏览器什么东西可以留在本地。

先看压缩。gzip 的原理是把文本内容在服务器端压一遍，浏览器收到后再解开，传输体积通常能降到原来的三成左右。HTML、CSS、JS 这类文本文件压缩率最高，图片和视频本身已经是压缩格式，再 gzip 一遍纯属浪费 CPU。所以配置的核心是：开 gzip，但要指定只压文本类型。

第二个问题是缓存。浏览器每次访问页面，页面上引用的 CSS、JS、图片都要重新下载一遍，哪怕它们一个月都没变过。解决思路是给响应头加上 Cache-Control，告诉浏览器这些文件可以放心缓存多久。这里有个讲究：带指纹的文件（比如 app.a3f9c2.css）内容一变文件名就变，可以放心缓存一年；不带指纹的普通静态文件给个一到三十天比较稳妥。

打开 nginx.conf，在 http 块里加上 gzip 配置：

http {
 # 基础压缩配置
 gzip on;
 gzip_comp_level 5;
 gzip_min_length 1024;
 gzip_vary on;
 gzip_types text/plain text/css application/json
 application/javascript text/xml application/xml
 application/xml+rss text/javascript image/svg+xml;
 
 # 静态资源缓存策略
 # 带指纹的文件：缓存一年（immutable 告诉浏览器不要发验证请求）
 location ~* \.(css|js)\?v= {
 expires 365d;
 add_header Cache-Control "public, immutable";
 }
 
 # 普通图片和字体：缓存 30 天
 location ~* \.(jpg|jpeg|png|gif|webp|avif|ico|woff2?|ttf|otf)$ {
 expires 30d;
 add_header Cache-Control "public";
 }
}

几个参数的取舍说一下。gzip_comp_level 从 1 到 9，级别越高压得越小但 CPU 花得越多，5 是公认的性价比点，再往上提一级体积只差百分之一二，CPU 却翻倍。gzip_min_length 1024 表示小于 1KB 的文件不压，因为压完可能反而更大，还得搭上 CPU。gzip_vary on 很容易被漏掉——它会加一个 Vary: Accept-Encoding 响应头，没有它，CDN 或代理服务器可能把 gzip 版本发给不支持压缩的老浏览器，页面直接白屏。

改完先验语法再重载：

nginx -t && nginx -s reload

验证压缩是否生效，关键是模拟浏览器的 Accept-Encoding 头，因为 curl 默认不带这个头，服务器自然不会压缩：

# 带 Accept-Encoding 头测试，看 Content-Encoding 是不是 gzip
curl -sI -H "Accept-Encoding: gzip" https://example.com/ | grep -i "content-encoding\|vary"
 
# 输出里应该有这两行：
# Content-Encoding: gzip
# Vary: Accept-Encoding
 
# 顺便对比下压缩前后传输体积
curl -s -o /dev/null -w "原始: %{size_download} 字节\n" https://example.com/
curl -s -H "Accept-Encoding: gzip" -o /dev/null -w "压缩: %{size_download} 字节\n" https://example.com/

验证缓存策略，看静态文件的 Cache-Control 和 Expires 头：

curl -sI https://example.com/logo.png | grep -i "cache-control\|expires"
# 期望输出：
# Cache-Control: public
# Expires: ...(一个月后的日期)

有个坑要提：如果你的站点前面套了 CDN，Nginx 的 Cache-Control 头会直接影响 CDN 节点的缓存行为，等于一个头管了浏览器和 CDN 两层。这时候反而要更谨慎——HTML 页面本身不要设长缓存，否则文章更新了 CDN 节点还发旧版本。HTML 这类入口文件建议单独给 no-cache，让每次请求都回源验证，只把改动不频繁的静态资源交给缓存。

还想再榨一点性能的话，可以上 brotli（.br 压缩，同类文本比 gzip 再小 15% 左右），Nginx 官方没带这个模块，需要装 ngx_brotli 第三方模块，宝塔面板和 1Panel 都有现成开关。对新站来说，先把上面这套 gzip 加缓存的组合拳打完，已经能解决 PageSpeed 里八成的传输类扣分项了。

相关阅读：本篇是《性能与安全加固总清单：按这张表打勾，新站48小时达到生产水准》性能组的第一项。总纲把九项加固按打勾表排好，新站照表推进，48 小时到生产水准。

Nginx开启gzip和静态资源缓存：两条配置让PageSpeed涨30分

相关文章