❗️Нативный lazy-loading для <iframe> теперь поддерживается во всех браузерах Chromium + Firefox

Чтобы работало, пропишите атрибут loading=lazy в теги iframe: <iframe loading=lazy>

Это откладывает загрузку фреймов до тех пор, пока пользователь не проскролит до них.

📌 Почему это важно?

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

Сниппет для автоматической простановки loading=lazy в теги <iframes> внутри записей и HTML-виджетах (добавить в functions.php активной темы)

add_filter( 'widget_custom_html_content', 'lazyIFRAME', 10 );

add_filter( 'widget_text', 'lazyIFRAME', 10 );

add_filter('the_content','lazyIFRAME', 10);

function lazyIFRAME($content) {

$content = str_replace('<iframe','<iframe loading="lazy"', $content);

return $content;

}

P.S. Сниппет написал @big_jacky, автор плагина Helper Lite for PageSpeed

Ринат Хайсман, @seospecialist

July 24, 2020
3 comments
Avatar
Aleksey
Тока вчера гуглил этот вопрос. Спасибо
Avatar
Rinat Haisman
Aleksey Тока вчера гуглил этот вопрос. Спасибо
Всегда пожалуйста, рад быть полезным.
Avatar
Nondescript Yura
теперь ждем для элемента background-image: url("link");
Do you want to add a new comment?