Нативный 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
Есть вопросы или нашли ошибку? Напишите комментарий (можно без регистрации), отвечать стараюсь быстро.
