Нативный lazyload в браузере Google Chrome

Алексей,

Достаточно добавить параметр loading="lazy" картинкам и все будет работать, проверял на этом блоге.

Больше ничего не требуется, атрибут src менять не нужно, только добавить loading. Пример:

<picture>
    <source srcset="/upload/resize_cache/iblock/0d3/382_229_1/0d3a1d78323dad13fb7c5440ed9d3968.jpg" media="(max-width: 767px)">
    <source srcset="/upload/iblock/0d3/0d3a1d78323dad13fb7c5440ed9d3968.jpg">
    <img loading="lazy" class="blog__post-img" src="/upload/iblock/0d3/0d3a1d78323dad13fb7c5440ed9d3968.jpg" alt="Добро пожаловать">
</picture>

Да, доступно с 76 версии браузера и ругается валидатор :(

Из js решений мне больше всего понравился этот вариант: https://github.com/verlok/lazyload

Опубликовано 26 Августа 2019 | Обновлено 9 Сентября 2019
разработчику, новости, производительность

Возврат к списку

Комментарии