Прошедшая неделя запомнилась многочисленными новостями о функциональных плагинах WordPress. Феликс Арнтц, коммиттер WordPress и инженер-разработчик программ в Google, анонсировал планы по внедрению «ленивой загрузки» (lazy loading) в ядро WordPress. Если тестирование пройдет успешно, эта функция может появиться в WordPress 5.4 в марте.
Концепция lazy loading позволяет отображать веб-страницы без загрузки определенных ресурсов, когда они не требуются. Это приводит к ускорению загрузки страниц и экономит трафик на стороне посетителя. «Ленивая загрузка» особенно полезна при выводе изображений в сети.
В противовес «ленивой загрузке» используется также «ускоренная загрузка» (eager loading), которая позволяет выводить все массово. По умолчанию именно так и загружаются все изображения в сети. Это часто приводит к снижению производительности веб-страниц с многочисленными изображениями, при этом чаще всего многие изображения даже не попадают в область просмотра пользователя при первом посещении сайта.
В течение многих лет разные JavaScript-библиотеки по-разному пытались представлять этот функционал, и далеко не всегда успешно. Нативное решение постепенно появлялось и в браузерах. Такая «ленивая загрузка» работает путем добавления атрибута loading к img или iframe. Затем уже браузеры могут решить, как подгружать ресурс, основываясь на значении атрибута. В настоящее время Chrome, Edge и Opera успешно обрабатывают атрибут loading. Как только атрибут официально войдет в спецификацию HTML, этот функционал станет стандартом, поддерживаемым всеми браузерами.
Новый функциональный плагин Lazy Loading теперь доступен в каталоге плагинов WordPress. Плагин опирается только на нативную браузерную поддержку, не внедряя никакого дополнительного JavaScript-кода. Реализация позволяет добавить атрибут loading к изображениям в контенте записи, в цитатах, комментариях, текстовых виджетах, аватарах и экземплярах базовых функций изображений в WordPress. По умолчанию плагин устанавливает для всех изображений «ленивую загрузку».
Наряду с обработкой изображений большого размера в WordPress 5.3, эта опция позволит в целом привести к ускорению работы пользователей в сети. За последние несколько лет число пользователей, загружающих крупные изображения через смартфоны, заметно выросло, что только усугубило проблемы медленной сети. Вот почему крайне важно, чтобы WordPress постоянно продвигал оптимизацию изображений.
«Если бы в WordPress по умолчанию добавлялась ленивая загрузка, это значительно повлияло бы на производительность и опыт взаимодействия для миллионов сайтов – при этом от пользователей не требовалось бы никаких технических навыков или понимания концепций», — рассказал Арнтц в анонсе. – «Принятие нового атрибута loading – это отличный шанс для WordPress проложить путь к быстрой загрузке сети».
Арнтц и команда разработчиков изначально выпустили плагин для lazy loading в сентябре 2019 года. Это произошло вскоре после того, как Google добавили атрибут loading в версию 76 браузера Chrome. Плагин Native Lazyload в данный момент имеет более 7000 установок.
Как это отразится на уже существующих плагинах
Поскольку не все браузеры поддерживают в данный момент атрибут loading, пользователи могут пока опираться на сторонние плагины для реализации «ленивой загрузки» (до тех пор, пока функционал lazy loading не появится в ядре WordPress).
Код в плагине Lazy Loading пытается определить, есть ли атрибут loading у изображения. Если нет, то атрибут добавляется. Соответственно, плагин не должен вызывать проблем при работе в связке с другими решениями для «ленивой загрузки». Это поможет избежать конфликтов.
Разработчикам плагинов для lazy loading рекомендуется начать тестировать свои плагины на соответствие требованиям WordPress 5.4. Тикет Lazy Loading API в Trac позволяет получить всю необходимую информацию по данной опции. Разработка функционала ведется в GitHub-репозитории.
Источник: wptavern.com
Да, очень хорошо, что в WordPress появилась такая возможность, ведь раньше всё это реализовывалось через плагин wprocket и других. Теперь посетителям сайтов не придётся ждать, пока картинка прогрузится. Он вполне может зайти на страницу и увидеть контент, даже если скорость интернета слабая, то по мере прогружения картинки — посетитель увидит её. Данная функция способствует увеличению скорости загрузки сайта. А вообще я бы рекомендовал подключить CDN хранилище себе на сайт, например плагином JetPack. В нём уже есть встроенная функция поддержки бесплатного CDN хранилища, но поддерживается она только для изображений. То есть система определяет место нахождения пользователя и доставляет ему контент (в нашем случае картинку) из ближайшего хранилища. Это очень значительно увеличивает скорость загрузки сайта, особенно если у Вас интернет-магазин!
Ставить весь Jetpack ради одной функции — это неудобно. Если только помодульно. Есть плагины, которые предлагают конкретные модули Jetpack (если эти плагины еще не прикрыли).
И интересно, как будет решаться проблема с lazy loading в связке с Revolution Slider и Envira Gallery — с этими плагинами были известные конфликты (вывод: автоматом включить lazy loading для всех изображений на сайте нельзя).
Согласен, что ставить неудобно и можно поставить помодульно. По-поводу Revolution слайдера и Envira галлереи — нужно тестировать, на край использовать другие плагины. Я пользуюсь смарт слайдером про и ни разу ещё не пожалел, и «давит» на сайт он меньше, чем революшн
Смущает, что опция включается автоматически для всего и повлиять на это никак нельзя. Складывается впечатление, по многочисленным последним нововведениям, что предоставить выбор пользователям — это не путь руководителей экосистемы WordPress.
Можно сделать опцию отключаемой: кому нужно — включил, кому нет — проигнорировал. Либо пойти далее: выборочная активация.
Но это мысли вслух.
Если что-то внедряется автоматически и является довольно спорным новшеством, то появляются плагины от сторонних разработчиков для отключения этого. Так было с разными нововведениями.
Это да. Уже привыкли. :)
Просто видимо не так выразился: было бы хорошо, если бы WordPress стал более гибок, без дополнительных расширений. Открыл ветку в меню — проставил \ убрал галочки и без сторонних решений, которые нередко спустя время перестают поддерживаться / обновляться.
А это у них идеология такая: чтобы пользователь меньше думал. Потому и выбора особо не оставляют. Принимают решения за нас)