Gzip: что это и как включить сжатие
Gzip — алгоритм сжатия для HTTP-передачи, уменьшающий размер HTML, CSS и JS файлов на 60-80%. Обязателен для быстрой загрузки сайта.
Что такое Gzip
Gzip — алгоритм сжатия данных, широко используемый для сжатия HTTP-ответов. Когда сервер отправляет HTML, CSS, JS, JSON файлы, он может сжать их с помощью gzip прежде чем передать браузеру. Браузер автоматически распаковывает данные.
Gzip существенно снижает объём передаваемых данных и ускоряет загрузку страниц.
Насколько эффективен Gzip
Степень сжатия зависит от типа файла:
| Тип файла | Без сжатия | С Gzip | Экономия | |-----------|-----------|--------|---------| | HTML | 100 KB | 25 KB | 75% | | CSS | 80 KB | 15 KB | 81% | | JavaScript | 200 KB | 60 KB | 70% | | JSON | 50 KB | 10 KB | 80% | | Изображения | Уже сжаты | — | ~0% |
Изображения (JPEG, PNG, WebP) уже содержат собственное сжатие — дополнительный gzip не даёт эффекта.
Как браузер запрашивает сжатие
Запрос браузера:
GET /page HTTP/1.1
Accept-Encoding: gzip, deflate, br
Ответ сервера:
HTTP/1.1 200 OK
Content-Encoding: gzip
Content-Type: text/html
br — это Brotli, более эффективный алгоритм сжатия (см. ниже).
Как включить Gzip
Nginx
http {
gzip on;
gzip_comp_level 6;
gzip_min_length 1000;
gzip_types
text/plain
text/css
text/javascript
application/javascript
application/json
application/xml
image/svg+xml;
gzip_proxied any;
gzip_vary on;
}
Apache (.htaccess)
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/plain text/css
AddOutputFilterByType DEFLATE application/javascript application/json
AddOutputFilterByType DEFLATE image/svg+xml
</IfModule>
Node.js / Express
const compression = require('compression');
app.use(compression({
level: 6,
threshold: 1024 // не сжимать файлы < 1KB
}));
Next.js
Next.js включает gzip сжатие по умолчанию. Для дополнительной настройки:
// next.config.js
module.exports = {
compress: true, // по умолчанию true
}
Gzip vs Brotli
| Аспект | Gzip | Brotli | |--------|------|--------| | Степень сжатия | Хорошая | На 20-30% лучше | | Поддержка | Все браузеры | Все современные браузеры | | Процессорная нагрузка | Низкая | Выше (при максимальном уровне) | | Рекомендация | Для совместимости | Предпочтительнее |
Проверка сжатия на reChecker
Используйте HTTP/2 & Brotli для проверки включения gzip и Brotli на вашем сайте. Инструмент проверит:
- Наличие заголовка
Content-Encoding: gzipилиbr - Фактическое сжатие для основных типов файлов
- Протокол HTTP/2 и другие параметры производительности
FAQ
Gzip сжимает изображения? Технически да, но эффект минимальный — JPEG, PNG, WebP уже содержат собственное сжатие. Применяйте gzip только к текстовым форматам: HTML, CSS, JS, JSON, XML, SVG.
Нужно ли сжимать файлы размером менее 1 KB? Нет. Overhead на заголовки сжатия и процессорное время не оправдывает сжатие маленьких файлов. Минимальный порог 1-2 KB.
Влияет ли уровень сжатия на скорость сервера? Да. Уровень 1 — быстро, но слабее сжимает. Уровень 9 — максимальное сжатие, но нагружает CPU. Уровень 5-6 — оптимальный баланс для большинства сайтов.
Попробуйте инструмент
Проверьте gzip на вашем сайте с помощью бесплатного инструмента.
HTTP/2 & Brotli →