Что такое gzip и Brotli?

Это алгоритмы сжатия, которыми сервер сжимает текстовые файлы сайта (HTML, CSS, JavaScript) перед отправкой браузеру. Браузер их распаковывает и показывает страницу как обычно, но по сети передаётся в разы меньше данных. gzip поддерживается всеми браузерами, Brotli более новый и сжимает плотнее.

Насколько сжатие ускоряет сайт?

Текстовые ресурсы сжимаются обычно в 3–4 раза, а Brotli — ещё на 15–25% сильнее gzip. Это значит, что страница весом 300 КБ может «долетать» как 70–90 КБ. Выигрыш особенно заметен на мобильном и медленном интернете, где скорость передачи данных ограничена.

Нужно ли сжимать картинки через gzip?

Нет. Картинки (JPEG, PNG, WebP), видео и архивы уже сжаты собственными алгоритмами, и gzip/Brotli почти не уменьшат их размер, только зря нагрузят сервер. Сжатие применяют к текстовым ресурсам, а для картинок используют отдельную оптимизацию — выбор формата и уменьшение веса.

Как включить gzip или Brotli?

Сжатие настраивается на сервере. На обычном хостинге оно часто уже включено или включается галочкой в панели, иначе — парой строк в конфигурации (.htaccess для Apache, настройки Nginx). Через CDN сжатие обычно работает автоматически. Если не уверены — попросите поддержку хостинга включить gzip/Brotli для текстовых ресурсов.

Как проверить, что сжатие работает?

Откройте инструменты разработчика в браузере на вкладке «Сеть», обновите страницу и посмотрите заголовки ответа. Если есть строка content-encoding со значением br (Brotli) или gzip — сжатие работает. Если такой строки нет, сжатие не включено. Наличие сжатия также показывают онлайн-сервисы проверки скорости и PageSpeed.

Чем статическое сжатие отличается от динамического?

Динамическое сжатие жмёт файл на лету при каждом запросе — просто, но тратит процессор. Статическое сжимает файлы заранее, один раз, и сервер отдаёт готовую версию — идеально для неизменной статики (CSS, JS, шрифты). Лучшая практика: статику жать заранее с максимальным уровнем, а динамический HTML — на лету с умеренным.

Зачем нужен заголовок Vary: Accept-Encoding?

Один файл может отдаваться сжатым Brotli, gzip или без сжатия — в зависимости от браузера. Заголовок Vary: Accept-Encoding предупреждает кэширующие узлы хранить разные версии под разные браузеры. Без него промежуточный кэш может отдать Brotli-файл браузеру, который его не понимает. Обычно серверы и CDN проставляют Vary сами.

Сжатие gzip и Brotli

Страница сайта — это в первую очередь текст: HTML, CSS, скрипты. А текст отлично сжимается. Сжатие на сервере уменьшает то, что отправляется браузеру, в несколько раз — и страница долетает быстрее, особенно на медленном интернете. Это один из самых простых способов ускорить сайт, который часто забывают включить. Разберём, как он работает.

Как это работает

Когда браузер запрашивает страницу, он сообщает серверу: «я умею принимать сжатое». Сервер сжимает текстовые файлы перед отправкой, браузер их распаковывает — и показывает как обычно. Для пользователя всё прозрачно, а по сети летит в разы меньше данных. Два основных алгоритма:

gzip — проверенный временем, поддерживается абсолютно всеми браузерами. База, которая должна быть включена всегда.
Brotli — более новый алгоритм от Google, сжимает текст ещё плотнее (часто на 15–25% сильнее gzip). Поддерживается всеми современными браузерами по HTTPS.

Без сжатия≈ 300 КБ

gzip≈ 90 КБ

Brotli≈ 72 КБ

Примерное сжатие типичной HTML-страницы — точные цифры зависят от содержимого.

Всё происходит автоматически — пользователь видит обычную страницу, но данных летит меньше.

Что сжимать, а что нет

Сжатие применяют к текстовым ресурсам: HTML, CSS, JavaScript, SVG, JSON, шрифты в текстовых форматах. А вот картинки (JPEG, PNG, WebP), видео и архивы сжимать повторно не нужно — они уже сжаты своими алгоритмами, и попытка пожать их ещё раз только зря нагрузит сервер, почти не уменьшив размер. Для картинок работает другая оптимизация — про неё статья как сжать изображения.

Как включить

Сжатие настраивается на стороне сервера, и способ зависит от вашего хостинга:

Обычный хостинг. Часто сжатие уже включено или включается одной галочкой в панели. Если нет — добавляется парой строк в конфигурацию сервера (для Apache — через .htaccess, для Nginx — в настройках).
Через CDN. Если используете CDN, сжатие (включая Brotli) обычно включается на его стороне автоматически.
CMS. Многие движки и плагины оптимизации умеют включать сжатие из админки.

Если не уверены, как это сделать на вашем сервере — это тот вопрос, с которым стоит обратиться в поддержку хостинга. Просьба простая: «включите gzip/Brotli для текстовых ресурсов».

Как проверить, что работает

Откройте инструменты разработчика в браузере (вкладка «Сеть»), обновите страницу и посмотрите заголовки ответа. Если сжатие включено, в ответе будет строка вида:

content-encoding: br

Значение br означает Brotli, gzip — gzip. Если такой строки нет — сжатие не работает, и это первое, что стоит исправить. Также наличие сжатия проверяют онлайн-сервисы скорости и PageSpeed.

⚡

Сжатие — часть базовой оптимизации скорости. Рядом стоят время ответа сервера (TTFB), Core Web Vitals и ленивая загрузка картинок — вместе они и дают быстрый сайт.

Статическое и динамическое сжатие

Сжимать можно двумя способами, и разница важна для скорости. Динамическое сжатие — сервер жмёт файл на лету при каждом запросе. Просто в настройке, но тратит процессор на повторную работу. Статическое (предварительное) сжатие — файлы сжимают заранее, один раз, и сервер отдаёт готовую сжатую версию. Это идеально для того, что не меняется: CSS, JS, шрифты. Лучшая практика — статически пожать неизменную статику с максимальным уровнем (там можно не жалеть процессор, работа разовая), а для динамического HTML, который генерируется каждый раз, использовать сжатие на лету с умеренным уровнем. Многие сборки и CDN делают предварительное сжатие автоматически.

Уровни сжатия: баланс силы и нагрузки

У gzip и Brotli есть уровни — от слабого и быстрого до сильного и медленного. Соблазн выкрутить на максимум понятен, но не всегда оправдан. Для статических файлов, которые жмутся один раз заранее, ставьте максимальный уровень — экономия размера того стоит, а процессорное время разовое. А вот для динамического контента, который сжимается на каждом запросе, максимальный уровень — плохая идея: сервер будет тратить заметно больше процессора ради последних процентов размера, и под нагрузкой это аукнется. Здесь берут средний уровень — он даёт почти весь выигрыш при разумной нагрузке. Brotli тут особенно коварен: его высшие уровни очень медленные, поэтому для «на лету» используют пониженный.

Сжатие и кэширование

Сжатие отлично дружит с кэшем, но есть тонкость. Поскольку один и тот же файл может отдаваться по-разному (сжатым Brotli, gzip или вообще без сжатия — зависит от браузера), кэширующие узлы нужно об этом предупредить. Для этого сервер добавляет заголовок Vary: Accept-Encoding — он говорит кэшу: «храни разные версии под разные браузеры». Без него промежуточный кэш может отдать сжатый Brotli файл старому браузеру, который его не понимает, и страница сломается. На практике серверы и CDN обычно проставляют Vary сами, но знать про этот нюанс полезно.

Частые ошибки

Их немного, и все типовые. Самая обидная — сжатие вообще не включено: сайт годами отдаёт «голый» текст, теряя на ровном месте. Вторая — пытаются сжать картинки и видео, нагружая сервер без толку. Третья — настроили gzip, но не добавили Brotli, упуская лишние 15–25% на современных браузерах. Четвёртая — выкрутили максимальный уровень на динамическом контенте и перегрузили процессор. И пятая — двойное сжатие, когда жмёт и сервер, и CDN: это бессмысленно. Проверяется всё одним взглядом на заголовок content-encoding в ответе.

Коротко

Сжатие gzip и Brotli уменьшает вес текстовых файлов (HTML, CSS, JS) в несколько раз перед отправкой браузеру — страница грузится заметно быстрее, особенно на медленном интернете. gzip должен быть включён всегда, Brotli по HTTPS сжимает ещё плотнее. Картинки и видео повторно не сжимают. Включается на стороне сервера или CDN, часто одной настройкой; если сомневаетесь — попросите поддержку хостинга. Проверить легко: в заголовках ответа должна быть строка content-encoding со значением br или gzip.