Nginx启用Gzip或Brotli压缩可显著减小CSS/JS等文本资源体积，配合合理缓存策略（如expires 30d、文件名哈希）、sendfile、open_file_cache及keepalive优化，能大幅降低传输量并减少请求数，提升页面加载速度。

核心就两件事：压缩传输体积 + 让浏览器少发请求。CSS 和 JS 是纯文本，压缩效果明显；它们又通常长期不变，缓存策略用对了，二次访问几乎不走网络。

启用 Gzip 或 Brotli 压缩

让 Nginx 在发送前把 CSS/JS 文件“压扁”，大幅减少下载量：

• Gzip（兼容性好，开箱即用）：在 http 块中加入

  gzip on;<br>gzip_min_length 1024;<br>gzip_comp_level 6;<br>gzip_types text/css application/javascript;<br>gzip_vary on;

• Brotli（压缩率更高，约比 Gzip 多省 20%）：需先安装 ngx_brotli 模块，再配置

  brotli on;<br>brotli_comp_level 8;<br>brotli_types text/css application/javascript;<br>brotli_min_length 20;

• 注意：不要对已压缩的资源（如 WebP 图片、gzip 后的字体）重复压缩，也别压缩小于几十字节的小文件

设置合理缓存策略

CSS 和 JS 一旦发布，内容往往稳定数天甚至数月。利用浏览器缓存，用户第二次打开页面时直接读本地文件：

Java Maven Common

Java Maven 项目审查工作流的通用输入处理。当 Java Maven 项目以 ZIP压缩包或 GitLab 仓库 URL 形式提供且需要...时使用。

下载

• 在 server 或 location 块中添加

  location ~* \.(css|js)$ {<br>  expires 30d;<br>  add_header Cache-Control "public, max-age=2592000";<br>}

• 如果使用构建工具（如 Webpack/Vite），建议给文件名加哈希（如 main.a1b2c3.js），这样可放心设为一年缓存：expires 1y;，更新后文件名变，浏览器自然加载新版本
• 避免对未哈希的 JS/CSS 设过长缓存，否则用户可能卡在旧版本

配合系统级优化提升响应效率

压缩和缓存生效的前提是 Nginx 自身处理得快：

立即学习“Java免费学习笔记（深入）”；

• 开启 sendfile on;：让内核直接从磁盘送文件到网络，绕过用户态拷贝
• 启用 open_file_cache：缓存常用静态文件的元信息（如路径、权限、修改时间），减少 stat() 系统调用开销

  open_file_cache max=1000 inactive=20s;<br>open_file_cache_valid 30s;<br>open_file_cache_errors off;

• 确保 keepalive_timeout 足够（如 65s），让单个 TCP 连接复用多次请求，尤其利于加载多个 CSS/JS 的场景

配完记得 nginx -t 测试语法，再 systemctl reload nginx 生效。用浏览器开发者工具的 Network 标签查看资源的 Content-Encoding（确认 gzip/brotli）和 Cache-Control 响应头，就能验证是否跑起来了。