Представьте: ваш сайт загружается 5 секунд, но 80% времени уходит на передачу JavaScript-бандлов. Вы уже оптимизировали изображения, включили кэширование, но скорость почти не изменилась. Скорее всего, вы упустили сжатие на транспортном уровне. Мы настраиваем Gzip и Brotli на сервере, уменьшая размер контента в 3–10 раз без изменений в коде. Экономия на трафике может достигать 70% при использовании Brotli — это снижает затраты на хостинг и CDN.
Brotli даёт на 15–25% лучшее сжатие, чем Gzip, при сопоставимой нагрузке на CPU. Один из наших проектов — интернет-магазин с бандлом 1.2 МБ. После настройки Brotli с pre-compressed статикой размер уменьшился до 280 КБ, а LCP упал с 4.2 с до 1.8 с. Для статики мы используем pre-compressed файлы — .gz и .br создаются при сборке, сервер отдаёт их без повторного сжатия. Это экономит до 30% процессорного времени на пике.
Почему Brotli лучше Gzip?
Brotli использует словарь для HTML/JS/CSS, что даёт более плотную упаковку. Например, app.js 500 КБ сжимается до 130 КБ (Brotli) против 150 КБ (Gzip). Разница особенно заметна на мобильных сетях с ограниченной пропускной способностью. Кроме того, Brotli поддерживает уровни сжатия до 11, что позволяет максимально ужать статику при сборке. Однако на лету высокие уровни (9–11) сильно нагружают CPU, поэтому для динамического сжатия рекомендуется уровень 6.
| Параметр | Gzip | Brotli |
|---|---|---|
| Алгоритм | Deflate | LZ77 + словарь |
| Макс. уровень | 9 | 11 |
| Среднее сжатие (HTML) | 4x | 5x |
| Поддержка браузерами | 100% | ~95% |
Как минимизировать нагрузку на CPU при сжатии?
Основной способ — использовать pre-compressed статику. Файлы .gz и .br генерируются один раз при сборке проекта (например, с помощью vite-plugin-compression), а сервер отдаёт их напрямую, не тратя процессорное время на сжатие каждого запроса. Для динамического контента (HTML, JSON) применяется on-the-fly сжатие с уровнем 6 — баланс между степенью сжатия и нагрузкой. В пиковые часы можно отключить сжатие для больших файлов через директиву gzip_min_length 256. Мониторинг CPU позволяет своевременно скорректировать уровень сжатия — если нагрузка выше 80%, рассмотрите снижение уровня или увеличение gzip_min_length. Снижение нагрузки на CPU уменьшает затраты на серверные ресурсы.
Nginx: Gzip + Brotli
# /etc/nginx/nginx.conf или /etc/nginx/conf.d/compression.conf # Gzip — поддерживается везде gzip on; gzip_vary on; gzip_proxied any; gzip_comp_level 6; # 1-9, баланс CPU/сжатие; 6 — хорошая точка gzip_min_length 256; # не сжимать очень маленькие файлы gzip_types application/javascript application/json application/xml application/rss+xml image/svg+xml text/css text/html text/javascript text/plain text/xml font/woff font/woff2; # Brotli — нужен модуль ngx_brotli # Установка: apt install libnginx-mod-brotli brotli on; brotli_comp_level 6; brotli_types application/javascript application/json text/css text/html text/plain image/svg+xml font/woff2; Проверка:
curl -H "Accept-Encoding: br" -I https://example.ru/ # Ответ должен содержать: Content-Encoding: br curl -H "Accept-Encoding: gzip" -I https://example.ru/ # Ответ: Content-Encoding: gzip Pre-compressed static assets
Для статических файлов (JS, CSS, бандлы) — генерировать .gz и .br файлы при сборке, отдавать напрямую. Нет расхода CPU при каждом запросе:
// vite.config.ts import { defineConfig } from 'vite'; import viteCompression from 'vite-plugin-compression'; export default defineConfig({ plugins: [ viteCompression({ algorithm: 'gzip', ext: '.gz' }), viteCompression({ algorithm: 'brotliCompress', ext: '.br' }), ] }); # Nginx: отдавать pre-compressed файлы location ~* \.(js|css|woff2)$ { gzip_static on; # ищет .gz версию brotli_static on; # ищет .br версию (модуль ngx_brotli) expires 1y; add_header Cache-Control "public, immutable"; } Как проверить, что сжатие работает?
Используйте curl или вкладку Network в DevTools. В ответе должен быть заголовок Content-Encoding: br или gzip. Также проверьте Vary: Accept-Encoding — он указывает кеширующим серверам, что контент зависит от кодировки. Для пошаговой диагностики можно использовать онлайн-сервисы, например, проверку заголовков на сайте.
Если клиент не поддерживает Brotli, Nginx автоматически отдаёт Gzip или несжатый контент. Убедитесь, что директива gzip on включена — это гарантирует fallback. Использование CDN с поддержкой Brotli дополнительно ускоряет доставку контента и снижает нагрузку на исходный сервер.
Типичные результаты сжатия
| Файл | Оригинал | Gzip | Brotli |
|---|---|---|---|
| app.js | 500 кБ | 150 кБ | 130 кБ |
| app.css | 80 кБ | 18 кБ | 15 кБ |
| HTML страница | 50 кБ | 12 кБ | 10 кБ |
Уровни сжатия: рекомендации
Уровни 1–3 — низкая нагрузка CPU, слабое сжатие. 4–6 — баланс. 7–9 — высокое сжатие, но CPU растёт нелинейно: уровень 9 требует в 3 раза больше времени, чем 6. Для pre-compressed файлов используйте 11 (только Brotli) — компилируется один раз при сборке.
Apache
# .htaccess <IfModule mod_deflate.c> AddOutputFilterByType DEFLATE text/html text/css application/javascript AddOutputFilterByType DEFLATE application/json image/svg+xml font/woff2 </IfModule> Процесс настройки сжатия
- Анализ текущей конфигурации сервера (Nginx/Apache).
- Выбор уровня сжатия (Gzip 6, Brotli 6 — баланс).
- Настройка исключений (несжимаемые форматы: PNG, JPEG, MP4).
- Генерация pre-compressed файлов в сборке (Vite, Webpack).
- Проверка заголовков ответов (Content-Encoding, Vary).
- Мониторинг нагрузки на CPU.
Что входит в работу
- Настройка Gzip и Brotli на сервере (Nginx/Apache).
- Конфигурация pre-compressed статики (если используется сборщик).
- Проверка заголовков и тестирование сжатия.
- Документация с внесёнными изменениями.
- Рекомендации по уровням сжатия под ваш трафик.
Наши инженеры настраивают сжатие более 5 лет — мы оптимизировали скорость загрузки для 100+ проектов, снижая LCP и TTFB на 40–60%. Хотите так же? Свяжитесь с нами — проведём аудит и внедрим сжатие Gzip и Brotli за один день. Закажите настройку сжатия и получите консультацию по ускорению вашего сайта уже сегодня.