Как подключить Brotli в Nginx и ускорить сайт

Содержание

В материале рассказали, как собрать и настроить модуль Brotli в Nginx. Объяснили, чем Brotli лучше Gzip, и как проверить, что сервер или VPS отдаёт сжатый контент.

Введение

Каждый владелец сайта мечтает, чтобы страницы открывались мгновенно. Для ускорения загрузки обычно оптимизируют картинки, переходят на быстрые сервера, и всё это делается ради скорости. Есть ещё один способ ускорить сайт — сжимать передаваемые данные. Для этой цели Google и создал алгоритм Brotli.

В материале объяснили, как внедрить поддержку Brotli с помощью Nginx: что это за алгоритм, чем он отличается от Gzip и какие шаги нужны для его установки и настройки.

Аренда VPS/VDS — от ₽219/месяц

Почему выбирают VPS от AdminVPS:

✓ Дешевле физического сервера

✓ Более гибкий и мощный, чем обычный хостинг

✓ Бесплатная защита от DDoS и техподдержка 24/7

✓ Масштабируется под любые задачи

Виртуальный сервер VPS/VDS — ваш личный сервер для сайтов, магазинов, ботов и других проектов.

Для чего используется Brotli

Когда речь заходит о скорости сайтов, на помощь приходит Brotli. Этот алгоритм от Google умеет компактно упаковывать код и стили, и в большинстве случаев делает это эффективнее привычного Gzip. Brotli зачастую упаковывает текстовые файлы на 15–25 % плотнее, чем традиционный Gzip, при примерно той же скорости сжатия и распаковки.

Например, Brotli сжимает минифицированный CSS-файл размером ~330 КБ примерно до 55-56 КБ, тогда как gzip оставляет около 60 КБ. Выигрыш порядка 10 % с каждого файла на первый взгляд невелик, но в сумме на десятках ресурсов он становится ощутимым. А при более агрессивных настройках Brotli обгоняет Gzip ещё заметнее. В реальных условиях это выражается в ускорении загрузки. Пользователи получают облегчённые файлы, а значит, страницы отображаются быстрее. Нередко одно только подключение Brotli-компрессии повышает показатель Google PageSpeed Insights сразу на 30+ пунктов, и это без каких-либо других изменений на сервере.

Brotli работает только по HTTPS, но это не проблема, ведь все современные браузеры уже его поддерживают и запрашивают Brotli-версии файлов заголовком Accept-Encoding: br. Сервер отдаст сжатый вариант, а остальным клиентам автоматически отправится содержимое, сжатое Gzip. Совместимость при этом полностью сохраняется.

Поддержка Brotli в Nginx

Несмотря на очевидные преимущества Brotli, веб-сервер Nginx изначально не включает этот алгоритм из коробки. В стандартной поставке Nginx отсутствует встроенный модуль Brotli, поэтому поддержку придётся добавить самостоятельно, например, скомпилировав внешний динамический модуль и подключив его к уже установленному серверу. Ниже приведена пошаговая инструкция этого процесса.

Подготовка окружения

Для начала потребуется установить инструменты разработки и узнать текущую версию Nginx. Подключитесь к серверу с правами администратора, обновите репозитории и установите базовый набор утилит:

sudo apt update && sudo apt install -y build-essential git wget libpcre3 libpcre3-dev zlib1g-dev libssl-dev

Проверьте текущую версию Nginx, под которую предстоит собирать модуль:

nginx -v

Команда выведет строку вида nginx version: nginx/X.Y.Z. Запомните этот номер версии, исходники Brotli-модуля должны соответствовать именно вашему серверу, иначе модуль может не подключиться.

Сборка и установка Brotli-модуля

Исходники Brotli для Nginx лежат в открытом доступе на GitHub. Скачайте репозиторий в любую временную директорию:

git clone https://github.com/google/ngx_brotli.git

Затем перейдите в каталог с клонированным репозиторием и загрузите подмодули, в том числе саму библиотеку компрессии:

cd ngx_brotli
git submodule update --init
cd ..

Теперь всё готово для сборки. Перейдите в директорию с исходниками Nginx, распакованными ранее, например, ~/nginx-X.Y.Z, соответствующую вашей версии:

cd nginx-X.Y.Z

Запустите конфигурирование сборки Nginx с подключением Brotli-модуля:

./configure --with-compat --add-dynamic-module=../ngx_brotli

Данная команда подготовит сборку с учётом совместимости (--with-compat) и добавит наш модуль Brotli как динамический. Когда скрипт configure отработает, выполните компиляцию модулей:

make modules

После компиляции в директории objs вы найдёте два артефакта:

ngx_http_brotli_filter_module.so
ngx_http_brotli_static_module.so

Скопируйте их в стандартный каталог модулей Nginx, чаще всего это /etc/nginx/modules:

sudo cp objs/ngx_http_brotli_filter_module.so /etc/nginx/modules/
sudo cp objs/ngx_http_brotli_static_module.so /etc/nginx/modules/

Установите корректные права доступа, то есть, чтение для всех на новые модули:

sudo chmod 644 /etc/nginx/modules/ngx_http_brotli_*.so

Как загрузить Brotli в конфигурацию Nginx

Чтобы Nginx начал работать с Brotli, пропишите модуль в конфигурации.

Откройте файл /etc/nginx/nginx.conf от root и вставьте нужные строки перед началом блока http {:

load_module modules/ngx_http_brotli_filter_module.so;
load_module modules/ngx_http_brotli_static_module.so;

Сохраните файл и проверьте синтаксис конфигурации:

sudo nginx -t

Если ошибки не обнаружены, можно переходить к настройке параметров сжатия. На некоторых системах, например, Debian/Ubuntu, динамические модули могут подключаться через файлы в каталоге /etc/nginx/modules-enabled/. Убедитесь, что строки загрузки Brotli-модулей добавлены только один раз, либо в самом nginx.conf, либо в отдельном подключаемом файле, чтобы избежать дублирования.

Как задать параметры Brotli-сжатия

После подключения модулей включите их в настройках HTTP-сервиса. В блоке http { ... } файла конфигурации пропишите директивы Brotli:

brotli            on;
brotli_static     on;
brotli_comp_level 6;
brotli_types      text/plain text/css text/javascript application/javascript application/json application/xml application/xhtml+xml font/ttf;

Разберём по порядку основные параметры:

brotli on; — включает динамическое сжатие ответов на лету для указанных типов файлов.
brotli_static on; — разрешает отдачу заранее сжатых файлов с расширением .br, если такие лежат рядом с оригиналом. Это снимает лишнюю нагрузку, веб-сервер не будет сжимать один и тот же файл при каждом запросе.
brotli_comp_level 6; — задаёт уровень сжатия (диапазон 1–11). Практикой выработано, что уровень 5–6 даёт наилучший баланс между степенью сжатия и нагрузкой на CPU.
brotli_types ...; — перечисляет MIME-типы содержимого, которое нужно сжимать. В примере указаны самые распространённые текстовые форматы: HTML-страницы, стили CSS, скрипты JS и шрифты. При необходимости добавьте другие типы текстового содержимого, используемые на вашем сайте. Не включайте в список обычные изображения (JPEG, PNG), они и так хранятся в сжатом формате, дополнительное упаковывание не даст выигрыша.

Не отключайте Gzip, Nginx сам выберет Brotli для поддерживающих его браузеров, а остальным клиентам отдаст контент, сжатый старым методом. Таким образом вы сохраните совместимость и сжатие для всех пользователей.

После внесения изменений перезапустите Nginx, чтобы новые настройки применились:

sudo systemctl reload nginx

Либо выполните команду:

nginx -s reload

Этот вариант отправляет сигнал перезагрузки непосредственно процессу Nginx.

Проверка Brotli-сжатия

Убедиться, что всё работает, очень просто. Воспользуйтесь утилитой curl и сделайте HTTP-запрос к вашему сайту со специально указанным заголовком:

curl -I -H "Accept-Encoding: br,gzip" https://ваш-домен/

В ответе сервера вы должны увидеть заголовок Content-Encoding: br. Он означает, что Nginx отдал содержимое, сжатое Brotli. Также Nginx автоматически добавляет заголовок Vary: Accept-Encoding для корректного кеширования, чтобы промежуточные узлы и браузеры различали сжатые и несжатые версии ресурса.

Если вы видите Content-Encoding: br в заголовках ответа, поздравляем, ваш сервер успешно выдаёт Brotli-сжатый контент пользователям. Страницы сайта станут легче, что ускорит их загрузку особенно при медленном подключении.

Заключение

Настройка Brotli-компрессии в Nginx — это небольшое улучшение, которое приносит заметный результат. Вы вложили немного времени в установку модуля, а выиграли более быстрый отклик сайта. Разница особенно ощутима при медленном подключении: страницы загружаются значительно бодрее, когда их размер сокращён на десятки процентов.

Читайте в блоге: