Speed up your pageloads with this YouTube embed plugin for your Django CMS powered site. It requires a (free) YouTube Data API Key.
Quickstart
- Install djangocms-youtube :
pip install djangocms-youtube-lazyload
INSTALLED_APPS = ( . ‘djangocms_youtube_lazyload’, . )
python manage.py migrate
python manage.py collectstatic
DJANGOCMS_YOUTUBE_LAZYLOAD_API_KEY = »
This Youtube plugin reduces Page Load Time
When you embed any YouTube video on your website using standard IFRAME tags, you’ll be surprised to know how much extra weight that YouTube video will add to your page.
The resources (CSS, images and JavaScript) will download even if the visitor on your website has chosen not to watch the embedded YouTube video. This will noticably slow down your page.
djangocms-youtube-lazyload uses a clever workaround to reduce the time it would normally take to initially load the YouTube video player. Instead of embedding the full Youtube video player, which also takes a big on your requests and data-loading, it displays just the thumbnail images of the video and a ‘play’ icon is placed over the video so that it looks like a video player.
Lazy loading is too easy now
When the user hits the play button, the video thumbnail is replaced with the standard YouTube video player. The extra resources are thus loaded only when the user has decided to play the embedded video and not otherwise.
Note: Mobile devices require two taps to play the video. Tap the image once to remove it and display the video player. Then, tap the play button to begin the video.
Schema.org Integration
Full support for schema.org videoObject markup.
Video Endscreen
Plugin can have child plugins (i.e other plugins placed inside this plugin), rendered as an overlay, when the video finishes. You can disable this functionality by overriding DJANGOCMS_YOUTUBE_LAZYLOAD_ALLOW_CHILDREN in your settings.py file
Источник: pypi.org
Ленивая загрузка изображений (LazyLoad): что это и как ее сделать?
Lazyload или ленивая загрузка изображений — это способ оптимизации сайта, представляющий собой отложенную загрузку изображений на просматриваемой странице.
Что такое LazyLoad
Ленивая загрузка — это способ оптимизации скорости сайта, при котором нужные пользователю изображения загружаются при выполнении определенного действия.
В большинстве случаев картинки и изображения подгружаются пользователю лишь в том случае, когда они попадают в видимую часть экрана. Пример:
Отложенная загрузка изображений Lazy Load на сайте
Важно! при работе данной функции будут задействованы технологии AJAX и JavaScript, поэтому пользователи, отключившие в браузере JS функции не будет доступна отложенная загрузка.
Виды ленивой загрузки сайта
- Скроллинг. В этом случае изображения загружаются пользователю только после того, как он ознакомился с материалов и прокрутил страницу. Наиболее популярный способ ускорения сайта, использующийся в социальных сетях, интернет-магазинах, досках объявлений и маркетплейсах;
- Клик. Контент в частности картинка будет доступна лишь после нажатия на нее. Чаще всего представляет собой открытие полномасштабного изображения после ознакомления с миниатюрой;
- Фоновый режим. Данный способ подразумевает загрузку полномасштабных фото, которые могут понадобиться пользователю при последующем ознакомлении с контентом. Перед тем как применять его потребуется изучить поведение пользователей и определить, действительно ли им потребуются загружаемые данные в дальнейшем.
Как внедрить ленивую загрузку на сайт WordPress
При использовании сайта на базе CMS WordPress потребуется воспользоваться плагином Autoptimize.
Для этого переходим в консоль-управления и открываем вкладку «Плагины»-«Добавить новый».
Вбиваем в строку поиска «Autoptimize» и устанавливаем его.
После активируем плагин.
Далее переходим в настройки плагина.
Теперь необходимо перейти в «Изображения» и активировать «Ленивую загрузку изображений» (Lazyload).
Все готово, функция активирована и можно проверить скорость загрузки сайта.
Результаты внедрения ленивой загрузки
На сайте SeoPulses результаты до внедрения данного функционала.
После внедрения данного функционала.
Подписывайтесь на наш канал в Яндекс.Дзен
Подписывайтесь на наш Telegram-канал
Подписывайтесь на наш Youtube-канал
Подписывайтесь на нашу группу ВКонтакте
Источник: seopulses.ru
lazy load wordpress: как добавить ленивую загрузку на сайт?
Увеличить скорость работы WordPress-сайта можно с помощью ленивой загрузки (lazy load wordpress).
Очевидно, что чем больше запросов браузер отправляет серверу, тем дольше длится загрузка. В то же время, чем больше весит страница (например, если она содержит большое количество изображений), тем дольше она будет загружаться.
Ленивая загрузка задерживает загрузку некоторых частей страницы до тех пор, пока они не понадобятся пользователю. Данная статья рассказывает о преимуществах и недостатках этого метода. А также том, как реализовать его в WordPress.
Что такое ленивая загрузка (lazy load wordpress) и чем она полезна
Ленивая загрузка – это способ не дать браузеру загружать все части страницы одновременно. Веб-страница становится легче и требуется меньше данных для передачи с сервера в браузер.
Суть этого способа заключается не в том, чтобы запрещать браузеру загружать ресурсы и изображения. Ленивая загрузка просто задерживает их отображение до того момента, когда они понадобятся пользователю.
Например, картинка не нужна на странице, пока пользователь не прокрутит ползунок, чтобы ее увидеть. Поэтому браузеру не обязательно загружать эту картинку, пока она не понадобится. Именно это и делает ленивая загрузка.
Использование ленивой загрузки
Ленивая загрузка чаще всего применяется к изображениям. Возможно, вы замечали ее на популярных сайтах типа Buzzfeed. Они используют ленивую загрузку, чтобы контент быстрее отображался в браузере.
Также отложенная загрузка применяется к видео, скриптам и комментариям. По сути, перемещение файлов JavaScript в футер страницы – это способ ускорения загрузки страницы.
Наверно, вы замечали, что YouTube загружает комментарии только после прокручивания страницы вниз. Таким образом обеспечивается быстрая загрузка видео.
Бесконечная прокрутка – это альтернатива классической пагинации страниц. При ее использовании дополнительные записи загружаются во время скроллинга страницы вниз. Это можно заметить на Pinterest и Pocket.
Это удобно для пользователей, ведь не нужно все время нажимать на номер следующей страницы.
Преимущества ленивой загрузки
Главное преимущество отложенной загрузки очевидно – быстрое отображение содержимого сайта. А также экономия трафика для пользователей. Ведь они не только быстрее загрузят сайт, но и не будут тратить трафик на изображения, которые могут и не увидеть.
Недостатки использования ленивой загрузки
Отложенная загрузка – не самый идеальный метод ускорения работы сайта. Рассмотрим его основные недостатки.
Из-за задержки загрузки часть контента сайта может быть не проиндексирована поисковым роботом. Из-за этого многие разработчики не используют отложенную загрузку для текстового содержимого.
Как добавить ленивую загрузку (lazy load wordpress) с помощью плагина
Для большинства пользователей лучшим вариантом станет использование плагинов ленивой загрузки для WordPress.