Встроенная поддержка отложенной загрузки для iframe в WordPress 5.7

Феликс Арнц, разработчик ядра WordPress и разработчик программ в Google, объявил о предстоящей поддержке отложенной загрузки фреймов . Эта функция включена в последнюю бета-версию WordPress 5.7 и будет официально выпущена в следующем месяце для более широкого сообщества.

WordPress поддерживает отложенную загрузку изображений с версии 5.5. Однако поддержка iframe не была включена в первоначальный набор функций. В то время браузерная поддержка iframe была широко распространена. Однако он еще не был официально оформлен как часть стандарта жизни HTML. Вскоре после этого он был добавлен в спецификацию HTML , и снова началось обсуждение добавления поддержки в WordPress.

В отличие от изображений, многие пользователи, скорее всего, не знают, что они используют фреймы. Основной вариант использования iframe – это блоки встраивания или система автоматического встраивания для пользователей классического редактора. Например, всякий раз, когда пользователь добавляет видео YouTube к своему сообщению в блоге, основной код выводит iframe.

Эти фреймы увеличивают размер страницы и замедляют загрузку.

Противоположность отложенной загрузке – это активная загрузка. Это значение по умолчанию для Интернета, при котором все ресурсы загружаются массово. Это также часто приводит к медленной загрузке веб-страниц, когда они содержат много изображений или окон iframe. Отложенная загрузка загружает только изображения и источники iframe, когда они появляются в области просмотра посетителя сайта. Это ускоряет время начальной загрузки страниц.

WordPress добавит loading=”lazy”атрибут только в том случае, если для iframe установлены явная ширина и высота. Это сделано для того, чтобы избежать эффекта сдвига страниц, который возникает при появлении окна iframe. Арнц много писал об этом эффекте, когда объявил о поддержке отложенной загрузки изображений . Та же проблема касается фреймов.

«Распространенной проблемой взаимодействия с пользователем на современных веб-сайтах является так называемое смещение макета, часто вызываемое медленной загрузкой медиаресурсов, таких как изображения», – написал он. «По умолчанию только после загрузки изображения браузер может правильно разметить страницу, в результате чего содержимое, например, под изображением будет сдвинуто. Эта проблема может быть легко решена путем предоставления widthи heightатрибуты imgтегов, как браузер будет использовать их для определения соотношения сторон изображения таким образом , что он может вывести макет страницы вперед фактически загрузок изображения «.

Бывают случаи, когда WordPress не добавляет атрибут загрузки даже для поставщиков oEmbed, которые он поддерживает. Содержимое iframe не предоставляется WordPress. Сторонние поставщики создают HTML-код и отправляют его обратно на отдельный сайт WordPress. Эти третьи стороны должны следовать рекомендациям по добавлению атрибутов ширины и высоты.

«Поскольку WordPress не может угадать размеры встроенного ресурса, loading=”lazy”атрибут будет добавлен только в том случае, если iframeтег oEmbed содержит оба атрибута измерения», – написал Арнтц.

В настоящее время фильтр применяется к виджетам содержимого сообщения, выдержки и текста. Возможно, WordPress когда-нибудь расширит это, чтобы добавить текст комментария.

Возможные проблемы с рекламой

МаАнна Стивенсон, владелица BlogAid, подняла вопрос о пользователях, которые размещают рекламу на своих сайтах. Возможны сценарии, в которых отложенная загрузка запрещена рекламными терминами или имеет технический конфликт.

«Было ли это проверено на людях, которые размещают рекламу на своих сайтах с помощью таких рекламных агентств, как Mediavine и AdThrive?» она спросила. «У них не может быть отложенной загрузки iframe, поскольку в объявлениях используются iframe, и у них есть собственный механизм отложенной загрузки для доставки».

Проблема в том, что не существует идеального способа исключить все рекламные услуги и отличить их от других типов iframe. С технической точки зрения, это должна быть функция «все или ничего».

Обработка рекламы прямо входит в компетенцию плагинов. Арнц рассмотрел такие варианты использования в своем посте. Разработчики могут отключить отложенную загрузку для оптовых iframe или настроить таргетинг на определенные iframe с помощью базового PHP. Чтобы создать плагин для определенных рекламных сервисов, потребуется всего несколько строк кода.

У Джеффа Старра также есть плагин для полного отключения отложенной загрузки под названием Disable Lazy Load . Это может служить временным решением, пока не появится что-то более специфичное для нужд пользователей.