Nginx静态资源压缩提速海外低速网络访问速度
当网站面向海外用户时,尤其访问者处于低带宽或高延迟网络环境,CSS、JS、图片等静态资源常常成为加载瓶颈。
通过 Nginx 对静态资源开启 gzip 压缩,可以把传输体积缩小 60% 以上,从而明显提升页面加载速度。
本文会从检查模块、编写配置到验证效果,带你完整走一遍 Nginx 静态资源压缩提速的实操流程。
先确认 Nginx 支持哪些压缩模块
在改动配置前,先确认当前 Nginx 是否已启用 gzip 相关模块。
绝大多数发行版默认包含 gzip 模块,但为了保险建议执行:
nginx -V 2>&1 | grep -o 'gzip\|brotli'
如果输出包含 gzip,说明可以直接使用。
若想用更高效的 Brotli,需要额外编译 ngx_brotli 模块,这里先以 gzip 为主,因为它兼容性最好,配置零门槛。
配置 gzip 压缩静态资源
打开 Nginx 主配置文件,例如 /etc/nginx/nginx.conf,在 http 块内加入以下内容:
http {
gzip on;
gzip_vary on;
gzip_proxied any;
gzip_comp_level 6;
gzip_min_length 1k;
gzip_buffers 16 8k;
gzip_http_version 1.1;
gzip_types text/plain text/css text/xml application/json application/javascript application/xml+rss image/svg+xml;
}
重点参数说明:
gzip_comp_level 6:压缩级别,1-9 之间,6 是速度和体积的均衡值。gzip_min_length 1k:小于 1KB 的文件不压缩,避免浪费 CPU。gzip_types:列出需要压缩的 MIME 类型,JS、CSS、JSON 是必选的。
配置完成后执行 nginx -t 检查语法,通过后运行 nginx -s reload 生效。
给静态资源加上长缓存,减少重复请求
压缩解决的是传输体积,缓存解决的是回源次数。
在 server 或 location 块中为静态资源设置较长的过期时间:
location ~*\.(jpg|jpeg|png|gif|ico|css|js|webp)$ {
expires 30d;
add_header Cache-Control "public, max-age=2592000";
access_log off;
}
这段配置让浏览器在 30 天内直接使用本地缓存,不再向服务器发请求。
当海外用户再次访问时,加载速度会接近本地站点。
避坑:这几个问题容易导致压缩不生效
图片资源不要用 gzip。 jpg、png、webp 本身已经压缩过,再压不仅效果差,还会增加 CPU 开销,所以上面的 gzip_types 中没有包含它们。
别重复压缩。 如果 Nginx 前面的 CDN 或反代已经生成 gzip,Nginx 再压一次只会浪费时间。
确认整条链路只做一次压缩。
检查 Content-Encoding。 配置生效后,用 curl 验证:
curl -H "Accept-Encoding: gzip" -I https://你的域名/assets/app.js
响应头里出现 Content-Encoding: gzip 就说明压缩已开启。
如果没有,请检查 gzip_types 是否匹配文件类型,以及 gzip_min_length 是否把文件过滤掉了。
验证整体提速效果
除了 curl,还可以打开浏览器 DevTools,切到 Network 面板,勾选“Disable cache”,重新加载页面。
查看 JS/CSS 资源的 Size 列,如果显示 (gzip) 或传输体积小于实际体积,说明压缩生效。
对比优化前后,如果原页面资源总大小是 2MB,开启 gzip 后通常会降到 1MB 以下。
对于海外低速网络,这部分节省直接转化为更快的首屏时间和更低的流量费。
如果你已经按上面步骤做完,但感觉海外访问仍有延迟,还可以考虑把静态资源分发到 CDN,或者更换具有 CN2 线路的海外云服务器。
Nginx 静态资源压缩是成本最低、见效最快的一步,建议先把它做好,再根据实际情况做进一步调整。