当前位置:首页 >  站长 >  建站经验 >  正文

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

 2026-09-11 09:22  来源: 互联网   我来投稿 撤稿纠错

  一键部署OpenClaw

网站上线第一天,用 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 装好了只会看欢迎页:手把手部署你的第一个站点

    apt装完Nginx,浏览器打开IP是那个Welcometonginx欢迎页,然后呢?很多教程到这就断了,新手对着配置文件一脸茫然。这篇把“从欢迎页到自己网站”这段路走完:核心是理解server块——Nginx靠它区分同一台机器上的不同网站,一个server块就是一个站。默认配置里那个欢迎页,本质上

  • 从零建站第一步:技术栈选型总纲,别一上来就纠结框架

    买了台VPS,然后呢?新手最常犯的错不是选错技术栈,而是在选型上耗掉两周,建站热情耗光在“用什么好”的纠结里。这篇是这个建站系列的总纲,先把大方向定死:你要建的站是什么类型,决定了后面所有的路。个人博客、企业官网、内容资讯站,WordPress依然是性价比最高的答案——全球四成以上网站跑在它上面,生

  • 网站突然打不开?先别慌,按这个流程排查,5分钟找到问题

    凌晨两点,你的网站突然打不开了。手机弹出监控告警,心跳直接漏了一拍。这时候最怕的不是网站挂了,而是你像无头苍蝇一样瞎折腾——重启服务器、改DNS、清缓存,一顿操作猛如虎,结果发现是域名到期忘了续费。网站出问题,80%的情况是线路或配置层面的原因,真正服务器崩了的不到两成。先按这个流程排查,别自己吓自

  • 图片还在用JPG直出?WebP平均省三成流量

    页面加载慢,八成是图重。同样一张照片,WebP比JPG小三成左右,比PNG小得多,画质肉眼几乎无差。主流浏览器全支持好几年了,图片格式升级是性价比排前几的优化。转换用cwebp命令行,批量处理写进脚本。质量参数75到85是甜点区,再高体积涨得快、画质几乎看不出变化。#单张转换,质量80#Window

    标签:
    网站建设
  • 从访问日志揪出SQL注入尝试:特征码就藏在URL里

    多数站长以为自己的站没人盯上,实际上随便一台公网服务器每天都被自动扫描器过一遍。有没有人试过SQL注入,access.log里写得明明白白,只是你没去看。注入尝试的特征很固定:URL或参数里出现单引号的编码%27、unionselect、and1=1这类探测语句、sleep(或benchmark(这

热门排行

信息推荐