Избегайте чрезмерной нагрузки на сеть

Большая нагрузка на сеть сильно коррелирует с длительным временем загрузки. Более того, такие страницы финансово невыгодны для пользователей, так как им, возможно, придется доплачивать за больший объем данных сотовой связи. Поэтому уменьшение общего размера сетевых запросов страницы улучшает впечатления о вашем сайте и снижает вероятные расходы пользователей на загрузку страницы.

# Когда проверка нагрузки на сеть считается непройденной в Lighthouse

Lighthouse показывает общий размер всех ресурсов, запрошенных вашей страницей, в кибибайтах (КиБ). Сначала перечисляются самые тяжеловесные запросы:

По данным Интернет-архива, медианная нагрузка на сеть составляет от 1700 до 1900 КиБ. Чтобы помочь выявить самые тяжеловесные нагрузки на сеть, Lighthouse отмечает страницы, чей общий объем сетевых запросов превышает 5000 КиБ.

# Как уменьшить размер нагрузки на сеть

Старайтесь, чтобы общий размер в байтах не превышал 1600 КиБ. Этот целевой показатель основан на объеме данных, который теоретически может быть загружен через соединение 3G, при этом метрика TTI (Время до интерактивности) должна составлять не более 10 секунд.

Вот несколько способов уменьшить размер нагрузки на сеть:

• Откладывайте запросы до тех пор, пока они не понадобятся. Один из возможных подходов см. в статье о шаблоне PRPL.
• Оптимизируйте запросы, чтобы максимально уменьшить их размер. Возможные методы:
  • Выполните минификацию и сжатие сетевых данных.
  • Используйте формат изображений WebP вместо JPEG или PNG.
  • Установите уровень сжатия изображений в формате JPEG на 85.
• Кешируйте запросы, чтобы страница не загружала ресурсы заново при повторном посещении. (См. целевую страницу «Надежность сети», чтобы узнать, как работает кеширование и как его реализовать.)

# Рекомендации по стекам

# Angular

Применяйте разделение кода на уровне маршрута, чтобы минимизировать размер пакетов JavaScript. Подумайте также о предварительном кешировании активов с помощью Angular service worker.

# Drupal

Подумайте об использовании отзывчивых стилей изображения, чтобы уменьшить размер изображений, загружаемых на вашу страницу. Если вы используете Views для отображения нескольких элементов контента на странице, подумайте о реализации разбивки на страницы, чтобы ограничить количество элементов контента, отображаемых на данной странице.

# Joomla

Подумайте о том, чтобы показывать отрывки в категориях статей (например, с помощью ссылки Read more (Читать далее)), уменьшить количество статей на одной странице, разделить длинные публикации на несколько страниц или использовать плагин для отложенной загрузки комментариев.

# WordPress

Подумайте о том, чтобы показывать отрывки в списке публикаций (например, с помощью тега more), уменьшить количество сообщений на данной странице, разделить длинные сообщения на несколько страниц или использовать плагин для отложенной загрузки комментариев.

# Ресурсы

Исходный код проверки Avoid enormous network payloads (Избегайте чрезмерных нагрузок на сеть).