Nginx高性能资源分发依赖三层协同：精准浏览器缓存（指纹资源设immutable、图片设7天、HTML设no-cache）、Brotli预压缩（构建生成.br文件，Nginx零计算返回）、优化本地IO与传输（sendfile、open_file_cache、read_ahead）及必要时叠加proxy_cache边缘缓存。
Nginx 实现高性能资源分发，关键不在“加功能”，而在于三层协同：让浏览器少发请求、让 Nginx 少做计算、让系统少走弯路。不是堆配置，而是理清链路中每一环的职责。
精准控制浏览器缓存，从源头减压
静态资源一旦发布就极少变更，必须用现代缓存策略替代过时的 Expires。
- 带哈希指纹的 JS/CSS/字体（如
app.a1b2c3.js）：设Cache-Control: public, max-age=31536000, immutable，浏览器永久信任该 URL，不发任何验证请求 - 图片、图标等无指纹资源：设
public, max-age=604800（7 天），平衡更新与复用 - HTML 页面：设
no-cache或max-age=60，确保每次打开能检查新版本 - 配置示例：
location ~* \.(js|css|woff2|ttf|eot|svg)$ { add_header Cache-Control "public, max-age=31536000, immutable"; }
启用 Brotli 预压缩，运行时零计算
Brotli 的优势不是“压得更小”，而是“不实时压”。它靠构建阶段生成 .br 文件，Nginx 直接读取返回，彻底规避 CPU 开销和首字节延迟。
- 构建时生成：Vite 用
vite-plugin-compression（algorithm: 'brotliCompress'），Webpack 用compression-webpack-plugin，CLI 可用find dist -type f \( -name "*.js" -o -name "*.css" \) -exec brotli {} \; - Nginx 配置必须完整：
brotli_static on; # 或 always brotli_types text/html text/css application/javascript image/svg+xml application/json; gzip off; # 关闭 gzip，避免双判断干扰
- 验证是否生效：
curl -H "Accept-Encoding: br" -I https://yoursite.com/app.js，响应头应含Content-Encoding: br
优化 Nginx 本地读取与传输链路
即使文件就在磁盘上，IO 和网络路径仍可能成为瓶颈。
- 启用零拷贝：
sendfile on; tcp_nopush on;，跳过用户态内存拷贝 - 缓存文件元数据：
open_file_cache max=1000 inactive=20s; open_file_cache_valid 30s;，减少open()系统调用 - 提升大文件效率：
read_ahead 1m;，提前加载后续数据块 - 注意
root与alias区别：root是路径拼接，alias是路径替换，静态资源映射错会导致 404
必要时叠加本地磁盘缓存（对接远端源）
当静态资源实际存在 OSS/S3 或后端服务时，Nginx 可作为边缘缓存节点。
- 定义缓存区：
proxy_cache_path /data/nginx/cache levels=1:2 keys_zone=static_cache:200m inactive=7d max_size=100g use_temp_path=off;
- 在 location 中启用：
location ~* \.(png|jpg|webp|gif|ico)$ { proxy_cache static_cache; proxy_cache_key "$scheme$host$request_uri"; proxy_cache_valid 200 304 302 365d; proxy_cache_use_stale error timeout updating http_500; proxy_pass https://your-oss-bucket.example.com; proxy_cache_lock on; proxy_cache_background_update on; }这能大幅降低回源压力，尤其在突发流量或源站抖动时提供兜底能力。
