lazy load wordpress: как добавить ленивую загрузку на сайт?
Увеличить скорость работы WordPress-сайта можно с помощью ленивой загрузки (lazy load wordpress).
Очевидно, что чем больше запросов браузер отправляет серверу, тем дольше длится загрузка. В то же время, чем больше весит страница (например, если она содержит большое количество изображений), тем дольше она будет загружаться.
Ленивая загрузка задерживает загрузку некоторых частей страницы до тех пор, пока они не понадобятся пользователю. Данная статья рассказывает о преимуществах и недостатках этого метода. А также том, как реализовать его в WordPress.
Что такое ленивая загрузка (lazy load wordpress) и чем она полезна
Ленивая загрузка – это способ не дать браузеру загружать все части страницы одновременно. Веб-страница становится легче и требуется меньше данных для передачи с сервера в браузер.
Суть этого способа заключается не в том, чтобы запрещать браузеру загружать ресурсы и изображения. Ленивая загрузка просто задерживает их отображение до того момента, когда они понадобятся пользователю.
Например, картинка не нужна на странице, пока пользователь не прокрутит ползунок, чтобы ее увидеть. Поэтому браузеру не обязательно загружать эту картинку, пока она не понадобится. Именно это и делает ленивая загрузка.
Использование ленивой загрузки
Ленивая загрузка чаще всего применяется к изображениям. Возможно, вы замечали ее на популярных сайтах типа Buzzfeed. Они используют ленивую загрузку, чтобы контент быстрее отображался в браузере.
Также отложенная загрузка применяется к видео, скриптам и комментариям. По сути, перемещение файлов JavaScript в футер страницы – это способ ускорения загрузки страницы.
Наверно, вы замечали, что YouTube загружает комментарии только после прокручивания страницы вниз. Таким образом обеспечивается быстрая загрузка видео.
Бесконечная прокрутка – это альтернатива классической пагинации страниц. При ее использовании дополнительные записи загружаются во время скроллинга страницы вниз. Это можно заметить на Pinterest и Pocket.
Это удобно для пользователей, ведь не нужно все время нажимать на номер следующей страницы.
Преимущества ленивой загрузки
Главное преимущество отложенной загрузки очевидно – быстрое отображение содержимого сайта. А также экономия трафика для пользователей. Ведь они не только быстрее загрузят сайт, но и не будут тратить трафик на изображения, которые могут и не увидеть.
Недостатки использования ленивой загрузки
Отложенная загрузка – не самый идеальный метод ускорения работы сайта. Рассмотрим его основные недостатки.
Из-за задержки загрузки часть контента сайта может быть не проиндексирована поисковым роботом. Из-за этого многие разработчики не используют отложенную загрузку для текстового содержимого.
Как добавить ленивую загрузку (lazy load wordpress) с помощью плагина
Для большинства пользователей лучшим вариантом станет использование плагинов ленивой загрузки для WordPress.
Lazy Load
Данный плагин установили более 90 000 раз и его рейтинг достаточно высок – 4 звезды.
Lazy Load использует jQuery.sonar для загрузки изображений только тогда, когда они появляются в области просмотра. Разархивированный плагин весит всего 20 КБ.
BJ Lazy Load
Плагин BJ Lazy Load установили более 60 000 раз и его рейтинг так же высок. Он заменяет все изображения и фреймы (включая видео с YouTube и Vimeo) в контенте заполнителем до просмотра пользователем.
Lazy Load by WP Rocket
Lazy Load by WP Rocket выполняет ленивую загрузку изображений и фреймов. Включая миниатюры, содержимое виджетов, аватары и смайлики. Данный плагин не использует библиотеки JavaScript. Поэтому он весит менее 10 КБ.
Более 10 000 сайтов используют Lazy Load от WP Rocket, что вызывает доверие.
a3 Lazy Load
Это один из немногих плагинов в этом списке, который имеет дополнительные параметры конфигурации. Он подходит для ленивой загрузки изображений, видео и фреймов в записях, страницах, виджетах, миниатюрах и аватарах. a3 Lazy Load совместим с WooCommerce.
Плагин позволяет выбрать эффекты для изображений, которые появляются на сайте. Также можно указать, куда загружать его скрипт: в шапку или футер страницы (плагин ленивой загрузки, который сам себя загружает).
Данный плагин совместим с рядом мобильных и кэширующих плагинов, а также с сетями доставки контента.
Crazy Lazy
Этот плагин ленивой загрузки изображений использует мало ресурсов. Crazy Lazy задерживает загрузку изображений до того, как их увидит пользователь.
Также можно установить собственные заполнители с помощью CSS и заменить ими изображения.
Speed Up – Lazy Load
Еще один плагин отложенной загрузки изображений и фреймов. Он весит всего 5 КБ. Реализован шорткод для деактивации ленивой загрузки. В том числе и для отдельных изображений.
WordPress Infinite Scroll – Ajax Load More
Плагин WordPress Infinite Scroll позволяет добавить на сайт бесконечную прокрутку. Он предназначен для отложенной загрузки записей, комментариев и других элементов страницы.
WordPress Infinite Scroll также работает с WooCommerce и Easy Digital Downloads.
WP YouTube Lyte
Плагин позволяет размещать специальные ссылки на ролики, которые загружает проигрыватель YouTube только после нажатия.
Также можно использовать шорткоды для вывода видеоконтента или установить плагин для автоматического парсинга ссылок YouTube.
Альтернативный плагин ленивой загрузки видео – Lazy Load for Videos.
В двух словах о ленивой загрузке для WordPress
В этой статье мы проанализировали, как работает и чем полезна ленивая загрузка. Ее можно применять не только к изображениям, но и к видео, скриптам, комментариям, записям и страницам.