Как настроить сжатие JS-файлов в Nginx?

Сжатие JS-файлов в Nginx уменьшает размер передаваемых данных и ускоряет загрузку страницы. Nginx умеет сжимать ответы на лету с помощью модуля gzip, а также отдавать заранее подготовленные файлы через gzip_static. Это особенно важно для крупных бандлов, которые генерирует Webpack или Vite.

Базовая настройка gzip

Директивы размещают в блоке http, server или location. Минимальный набор выглядит так:

gzip on;
gzip_types application/javascript text/javascript application/json;
gzip_min_length 1024;
gzip_comp_level 5;
gzip_vary on;

gzip_types указывает, какие MIME-типы сжимать. Для JS это application/javascript и text/javascript. gzip_min_length не даёт сжимать слишком маленькие файлы, где выгоды нет. gzip_vary добавляет заголовок Vary: Accept-Encoding, что важно для корректного кеширования.

Предварительное сжатие (gzip_static)

Если на этапе сборки создаются файлы app.js.gz, Nginx может отдавать их без сжатия на лету. Это экономит CPU:

location /static/ {
  gzip_static on;
  gzip_types application/javascript;
  root /var/www/site;
}

Файлы .gz обычно создают плагины compression-webpack-plugin или brotli-webpack-plugin. При этом важно, чтобы рядом лежал и оригинальный app.js — Nginx выберет .gz, если клиент поддерживает gzip.

Проверка результата

Проверить сжатие можно через curl с заголовком Accept-Encoding:

curl -H "Accept-Encoding: gzip" -I https://example.com/app.js

В ответе должен появиться Content-Encoding: gzip. Если его нет, проверьте gzip_types, права на файлы и что модуль gzip_static собран в Nginx.

Итог: включайте gzip on и gzip_types для JS в базовой конфигурации, а для продакшена с большим трафиком добавляйте gzip_static с предварительно сжатыми файлами — это снижает нагрузку на CPU и ускоряет отдачу статики.