Блог

Отложите загрузку скрытых изображений

Отложите загрузку скрытых изображений — пожалуй один из самых основных факторов который влияет на оценку скорости загрузки сайта в google pagespeed insights. Рекомендуется отложить загрузку всех изображений которые не видны на первом экране страницы. Это уменьшит время до начала взаимодействия. Самый распространенный способ — это lazy loading. Суть метода в том, что изображения динамически подгружаются во время прокрутки страницы.

Для wordpress есть много бесплатных решений с lazy load загрузкой, достаточно в репозитории ввести Lazy Load:

Рассмотрим работу Lazy Load на примере плагина a3 Lazy Load. После его установки и активации, на странице настроек плагина есть следующие опции:

Основная опция — это Активация ленивой загрузки — она включает Lazy Load.
Далее у нас есть дополнительные настройки:

  • Ленивая загрузка изображений
  • Ленивая загрузка для видео и iframe
  • Исключить URI’s и Страницы
  • Оптимизация скрипта загрузки
  • Плагины мобильных шаблонов WordPress
  • Эффекты и стили
  • Порог старта загрузки изображений

В принципе все довольно просто и понятно.

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

Этот код необходимо разместить в header.php. Он сработает для всех изображений с классом lazy. Так же в теге img, должен быть заявлен атрибут srcset.

Оставить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

© Copyright 2014 -  vchuy-develop.com. All rights reserved