Уменьшите объем контента в верхней части страницы

Это правило срабатывает, когда PageSpeed Insights обнаруживает, что для отображения контента в верхней части страницы необходимо отправлять дополнительные запросы.

Общая информация

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

Рекомендации

Чтобы страница загружалась быстрее, ограничьте объем данных, которые должны отображаться в ее верхней части (код HTML, изображения, CSS, JavaScript). Это можно сделать несколькими способами:

Измените структуру HTML, чтобы сначала загружался важный контент, располагающийся в верхней части страницы

Сначала загружайте основное содержание страницы. Измените структуру страницы так, чтобы в первоначальном ответе сервера содержалась необходимая информация для отображения наиболее важной части страницы. Остальное можно загрузить позже. Возможно, вам придется разделить код CSS на две части: встроенная часть, отвечающая за стили в верхней части страницы, и часть, загрузку которой можно отложить.

Изучите рекомендации по ускорению загрузки в примерах ниже:

  • Если код HTML запрашивает внешние виджеты перед загрузкой основного контента, измените порядок таким образом, чтобы основной контент загружался в первую очередь.
  • Если страница разделена на две части – боковую навигационную панель с одной стороны и основную статью с другой, рекомендуется в первую очередь загружать статью, а потом – боковую панель.

Уменьшите объем данных, которые используются вашими ресурсами

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