Включить сжатие текста

Текстовые ресурсы следует обслуживать со сжатием, чтобы минимизировать общее количество сетевых байтов. В разделе «Возможности» вашего отчета Lighthouse перечислены все несжатые текстовые ресурсы:

Скриншот аудита сжатия текста Lighthouse Enable

Как Lighthouse обрабатывает сжатие текста

Lighthouse собирает все ответы, которые:

  • Используйте текстовые типы ресурсов.
  • Не включайте заголовок content-encoding установленный на br , gzip или deflate .

Затем Lighthouse сжимает каждый из них с помощью GZIP, чтобы вычислить потенциальную экономию.

Если исходный размер ответа меньше 1,4 КБ или если потенциальная экономия при сжатии составляет менее 10 % от исходного размера, Lighthouse не помечает этот ответ в результатах.

Включите сжатие текста на вашем сервере

Включите сжатие текста на серверах, которые предоставили эти ответы, чтобы пройти этот аудит.

Когда браузер запрашивает ресурс, он будет использовать заголовок HTTP-запроса Accept-Encoding чтобы указать, какие алгоритмы сжатия он поддерживает.

Accept-Encoding: gzip, compress, br

Если браузер поддерживает Brotli ( br ), вам следует использовать Brotli, поскольку он может уменьшить размер файла ресурсов больше, чем другие алгоритмы сжатия. Найдите how to enable Brotli compression in <X> , где <X> — имя вашего сервера. По состоянию на декабрь 2022 года Brotli поддерживается во всех основных браузерах, кроме Safari для iOS. См. раздел «Совместимость браузера» для получения обновлений.

Используйте GZIP как запасной вариант Brotli. GZIP поддерживается всеми основными браузерами, но он менее эффективен, чем Brotli. Примеры см. в разделе «Конфигурации сервера» .

Ваш сервер должен вернуть заголовок HTTP-ответа Content-Encoding чтобы указать, какой алгоритм сжатия он использовал.

Content-Encoding: br

Проверьте сжатие ответа

Чтобы проверить, сжал ли сервер ответ:

Нажмите Control+Shift+J (или Command+Option+J на Mac), чтобы открыть DevTools. Откройте вкладку «Сеть».

  1. Нажмите Control + Shift + J (или Command + Option + J на ​​Mac), чтобы открыть DevTools.
  2. Откройте вкладку «Сеть» .
  3. Нажмите на запрос, который вызвал интересующий вас ответ.
  4. Откройте вкладку Заголовки .
  5. Проверьте заголовок content-encoding в разделе «Заголовки ответов» .
Заголовок ответа на кодирование контента
Заголовок ответа content-encoding .

Чтобы сравнить сжатый и распакованный размеры ответа:

  1. Нажмите Control + Shift + J (или Command + Option + J на ​​Mac), чтобы открыть DevTools.
  2. Откройте вкладку «Сеть» .
  3. Включите большие строки запросов. См. раздел Использование больших строк запроса .
  4. Посмотрите в столбце «Размер» интересующий вас ответ. Верхнее значение — это сжатый размер. Нижнее значение — это распакованный размер.

См. также Минимизация и сжатие полезной нагрузки сети .

Рекомендации для конкретного стека

  • Drupal : текстовые ресурсы следует обслуживать со сжатием (gzip, deflate или brotli), чтобы минимизировать общее количество сетевых байтов. Рассмотрите возможность использования CDN, который изначально поддерживает это, или настройте веб-сервер для выполнения этой операции. Узнать больше .
  • Joomla : включите параметр сжатия страниц Gzip ( Система > Глобальная конфигурация > Сервер ).
  • WordPress : включите сжатие текста в конфигурации вашего веб-сервера.

Ресурсы