Native Lazyload

Описание

Ленивая загрузка медиаданных с использованием встроенной функции браузера. Узнайте больше о новом атрибуте loading или посмотрите тикет ядра WordPress, где обсуждается включение аналогичной реализации в само ядро WordPress.

If the loading attribute is not supported by the browser, the plugin falls back to a JavaScript solution based on IntersectionObserver. For the case that JavaScript is disabled, but the loading attribute is supported by the browser, a noscript variant of the respective element will be added that also includes the loading attribute without any further changes.

«Нативный» означает «Быстрый»

If you have found your way over here, you are probably aware of how crucial performance is for a website’s user experience and success. You might also know that lazy-loading is a key feature to improve said performance. However, the solutions for lazy-loading so far still added a bit of overhead themselves, since they relied on loading, parsing and running custom JavaScript logic, that may be more or less heavy on performance.

This plugin largely does away with this pattern. It relies on the new loading attribute, which makes lazy-loading a native browser functionality. The attribute is already supported by Chrome, and will be rolled out to other browsers over time. The solution being «native» means that it does not rely on custom JavaScript logic, and thus is more lightweight. And «more lightweight» means «faster».

И последнее, но не менее важное замечание: следует учитывать тот факт, что плагин существенно улучшится со временем, поскольку все больше и больше браузеров внедряют поддержку атрибута loading.

Как использовать

Просто активируйте плагин, и все ваши изображения и фреймы в содержимом записи будут загружаться лениво.

Благодарность

Этот плагин частично основан на логике WP Rig и рекомендациях из web.dev и developers.google.com.

Установка

  1. Закачайте папку native-lazyload в директорию /wp-content/plugins/ или установите плагин через панель администрирования WordPress.
  2. Активируйте плагин через меню «Плагины» в WordPress.

Часто задаваемые вопросы

Где находятся настройки плагина?

Этот плагин не имеет страницу настроек. После активации он сразу начинает работать.

Как я могу отключить ленивую загрузку конкретного изображения или фрейма?

Вы можете добавить им класс skip-lazy, чтобы указать плагину, что вы хотите отключить ленивую загрузку для этого изображения или фрейма.

Плагин загружает дополнительный файл JavaScript! Как это отключить?

This is perfectly fair. Note that the plugin only loads the JavaScript file as a fallback for when the user’s browser does not support the native loading attribute yet. The file includes logic to still autoload the image in a non-native way. If you prefer to purely rely on the loading attribute and not provide any fallback, you can easily disable it by adding a line add_filter( 'native_lazyload_fallback_script_enabled', '__return_false' ) somewhere in your site’s codebase.

Работает ли плагин на AMP страницах?

Если вы используете AMP, то вам не нужна ленивая загрузка, поскольку AMP уже из коробки загружает лениво все медиаданные. Плагин построен таким образом, что он не нарушает совместимость с AMP, будьте в этом уверены.

Куда я могу отправить свой запрос в службу поддержки?

Для получения поддержки используйте форумы поддержки wordpress.org . Если у вас возникла техническая проблема с плагином и вы знаете, как ее исправить, вы также можете открыть тикет на Github.

Как я могу помочь в развитии плагина?

Если у вас есть идеи по улучшению плагина или устранению ошибок, не стесняйтесь сообщить об этом и создать тикет в официальном Github репозитории плагина. Пожалуйста, следуйте рекомендациям.

Вы также можете помочь проекту, переведя его на свой язык. Для этого перейдите по адресу translate.wordpress.org.

Отзывы

02.10.2019
Images do not load properly if you're using a browser other than Chrome. Reported the issue to support and have yet to receive any resolution or hint that they're working on it.
02.10.2019
I can't believe this actually comes from Google. It doesn't work. I installed it and it makes any pictures in the body of any post disappear, showing only the captions, not the actual photos. I am using a high speed connection, I have tested it in both Chrome and Edge. This clearly is not ready to be released. If it "speeds up" your site, it does so by just not showing your photos at all. I'm very disappointed.
20.09.2019
Only works on Chrome. Does not work on Opera and Firefox. I do not recommend using this plugin. (edit: I am talking about featured images)
Посмотреть все 18 отзывов

Участники и разработчики

«Native Lazyload» — проект с открытым исходным кодом. В развитие плагина внесли свой вклад следующие участники:

Участники

«Native Lazyload» переведён на 15 языков. Благодарим переводчиков за их работу.

Перевести «Native Lazyload» на ваш язык.

Заинтересованы в разработке?

Посмотрите код, проверьте SVN репозиторий, или подпишитесь на журнал разработки по RSS.

Журнал изменений

1.0.1

  • Улучшение совместимость с другими плагинами, используя более специфический класс и добавляя его только для резервного JS.
  • Запуск скрипта ленивой загрузки по событию DOMContentLoaded для поддержки совместимости с плагинами наподобие Autoptimize.
  • Отключение изменения элементов внутри ответа AJAX.

1.0.0

  • Первая версия