Brotli_static实现高性能静态压缩的核心是构建时预生成.br文件、运行时零计算、浏览器秒解压；需Vite/webpack插件生成.br文件，Nginx配置brotli_static on、brotli_types及权限匹配，并用curl或DevTools验证Content-Encoding: br响应头。
用 brotli_static 实现高性能静态资源压缩，核心是“构建时压好、运行时零计算、浏览器秒解压”。它不参与实时压缩，只做一件事：检查请求路径是否存在同名 .br 文件，有就直接发，没有就跳过——所以它快、稳、省 CPU，但前提是文件得提前生成、权限得对、类型得配准。
预压缩必须在构建阶段完成
前端打包工具要生成 .br 文件，Nginx 才能靠 brotli_static 找到它。不是 Nginx 帮你压，而是你提前压好放进去。
- Vite 项目：装
vite-plugin-compression，配置algorithm: 'brotliCompress'、ext: '.br'、threshold: 10240（≥10KB 才压） - Webpack 项目：用
compression-webpack-plugin，同样设algorithm: 'brotliCompress' - 手动压缩也行：
bro --quality 6 app.js -o app.js.br，适合补压或 CI 后处理
Nginx 配置要精准匹配文件与类型
brotli_static on 不会自动识别内容类型，它只看后缀和 MIME 类型是否对得上。配错就等于没开。
- 必须开启：
brotli_static on;（或更激进的brotli_static always;，找不到 .br 时会 fallback 到动态压缩） - 必须声明可服务的类型：
brotli_types text/html application/javascript text/css application/json image/svg+xml;（别写text/javascript，Chrome 已弃用） - 避免冲突：如果用了 phpEnv 或自带 gzip_static，务必关掉
gzip_static off;，否则 .gz 会抢在 .br 前被返回
权限和路径细节决定成败
文件存在 ≠ Nginx 能读。worker 进程以什么用户身份运行，.br 文件就得归谁所有。
- 查 Nginx 用户：
ps aux | grep nginx，通常为www或nginx - 查文件权限：
ls -l /path/to/app.js.br，确保属主属组匹配，例如www:www - 若权限不对，执行：
chown www:www /path/to/app.js.br - 注意：brotli_static 不报错、不降级、不日志警告——静默失败是最常见的排查盲区
验证是否真正生效
不能只看配置有没有语法错误，要确认浏览器实际收到了 .br 文件。
- 用 curl 检查响应头：
curl -H "Accept-Encoding: br" -I https://yoursite.com/app.js，应看到Content-Encoding: br - 在 Chrome DevTools 的 Network 标签页里，选中资源，看 Response Headers 和 Content-Length 是否明显变小
- 对比未压缩体积：比如原始
app.js是 286KB，app.js.br应在 210KB 左右（实测 Vue3+TS 项目平均再降 22%）
