club762.ru
Встраиваемый с помощью внешних запросов контент может сильно замедлить работу сайта. Это особенно верно в том случае, если запросы не могут быть кэшированы, и контент невозможно разместить на своем собственном домене, как в случае со сторонними видео, хранящимися на Youtube или Vimeo. Вызов внешних ресурсов в данных ситуациях неизбежен, однако он не должен никоим образом понижать ваш показатель PageSpeed.
Lazy Load for Videos – плагин, созданный WordPress-разработчиком Кевином Вебером, предназначенный для ускорения сайтов, которые тесно связаны с видео-контентом. Скорее всего, вы уже сталкивались с паттерном lazy loading для изображений: вы прокручиваете страницу вниз, и изображение появляется тогда, когда оно требуется. Вебер связал эту концепцию с загрузкой видео.
Вместо того чтобы загружать все видео на вашем сайте, плагин заменяет вложения Youtube и Vimeo на кликабельные изображения. Видео загружаются лишь в том случае, когда пользователь щелкает по изображению, чтобы воспроизвести видео. Плагин использует jQuery для реализации lazy load, поэтому никаких дополнительных JavaScript не требуется. Вы можете посмотреть лайв-демо на домашней странице плагина.
Вебер провел тест скорости, используя инструмент Network Panel в Chrome DevTools, который записывает время загрузки каждого требуемого ресурса. На изображении ниже показаны файлы, которые загружены при отключенном плагине в том случае, если встраивается одно YouTube-видео.
На изображении ниже показаны файлы, которые загружены уже при включенном плагине:
Быстрое сравнение показывает 50%-е сокращение размера требуемых ресурсов и задержки, что в общем счете сводится к выигрышу приблизительно двух секунд для времени загрузки. И это – улучшение только для одного встроенного видео. Вы можете представить себе, какую выгоду можно получить, если у вас на сайте размещена целая видео-галерея, загружающая Youtube-скрипты для каждого видео на странице.
«Я начал разработку Lazy Load for Videos для улучшения скорости загрузки страниц», отметил Вебер. Со временем он начал добавлять опции по изменению стилей плеера. «Эти новые возможности появились в результате требований пользователей плагина», говорит он. В настоящее время возможности плагина следующие:
- Вывод заголовков видео в превью-изображениях
- Добавление произвольных CSS через панель опций плагина
- Скрытие элементов управления в плеере Youtube
- Поддержка видео в текстовом виджете (только для Youtube)
- Выбор размеров миниатюр (standard или cover)
- Выбор между двумя цветовыми схемами для плеера Youtube (темная или светлая)
- Выбор между двумя цветовыми схемами для прогресс-бара Youtube-плеера, чтобы сделать акцент на тех видео, которые пользователь уже просмотрел (красная или белая)
- Отключение похожих видео
В будущем Вебер планирует включить опции по изменению стилей плеера Vimeo. Он хочет также добавить CSS-кнопки, чтобы еще больше увеличить скорость загрузки страниц в одном из последующих обновлений. Все остальные пользовательские предложения для будущих усовершенствований на данный момент находятся в рассмотрении, включая опцию выбора между несколькими кнопками play, загрузку своей собственной кнопки play, а также возможность добавлять превью-изображения для видео в фиды.
Кроме того, что плагин ускоряет ваш сайт, он также обеспечивает неплохой список опций по изменению стилей для вывода вашего видео. Если ваш сайт тесно связан с встраиваемым видео-контентом Youtube или Vimeo, то в таком случае скачайте плагин Lazy Load for Videos с сайта WordPress.org, чтобы увидеть, способен ли он повысить производительность вашего ресурса.
Есть плагины для lazy load изображений. Интересно, как это на самом деле влияет на SEO? Я встречал противоположные мнения.
В плане юзабилити мне лично не очень нравится lazy load изображений. Но возможно, в плане SEO есть определенный плюс — скорость загрузки повышается, а значит и показатели сайта тоже растут.
Скорость то повышается, но вставляются дополнительные ява скрипты и модифицируется код изображений, и с индексацией изображений могут возникнуть проблемы.
Согласен. Но вот для видео, как описано в статье — замена его изображением — мне кажется удобным шагом. Особенно если на сайте много видео. Хотя, с другой стороны, опять же, подгружаются дополнительные скрипты.
Имеет смысл когда на одной странице больше 2-3 видео. Подскажите, считает ли YouTube просмотры видео, если оно встроено таким образом и обработано этим плагином? Есть подозрение, что нет, но это только подозрение.
Этого, к сожалению, не знаю, нужно тестировать.
Похоже, что YouTube не сразу считает просмотры даже если видео на странице записи WordPress встроено дефолтовым кодом встраивания, взятым с YuTube. Вот сегодня у записи, к примеру, 800 просмотров, а на странице видео YouTube счетчик в 8 раз меньше. Я аж испугался, что YouTube и так не считает, но надеюсь он потом подведет статистику и засчитает просмотры.
А тестирование подсчета количества просмотров видео YouTube с плагином Lazy Load for Videos тоже можно будет только позже посмотреть, уж не знаю сколько времени должно пройти.. может сутки.
Бывает, что просмотры встроенных роликов вообще не засчитываются. К примеру, если на странице стоит autoplay (но не всегда). Поэтому тут много может быть подводных камней.
Да, там просмотры не сразу обновляются, нужно какое-то время будет подождать, чтобы понять.
Автоплей на сайте WordPress никогда не ставлю. А с недавнего времени и на лендингах тоже не ставлю автоплей, так как люди жалуются, что внезапный завод видео будит спящих по ночам))
Да, ценность автоплея сомнительна, особенно если человек несколько раз заходит на сайт, это начинает раздражать.