#javascript #html #google-chrome #lazy-loading
Вопрос:
Я знаю, что для правильной работы встроенной ленивой загрузки браузера (в chrome) вам необходимо определить высоту и ширину изображения.
Проблема в том, что мне нужно, чтобы мои изображения были отзывчивыми, поэтому я не могу установить абсолютную высоту и ширину. Тем не менее, я все еще хочу лениво загружать эти изображения, чтобы повысить производительность моего сайта.
Я попытался обойти это, обернув изображения в div с соотношением сторон, а затем установив высоту и ширину изображения на 100%. Непростительно, но кажется, что работают только абсолютные измерения.
Существует ли вообще возможный обходной путь для изначально ленивой загрузки изображений без абсолютных размеров, или для этого мне следует использовать библиотеку javascript (или они также не могут это исправить)?
примечание: я заметил, что это проблема только в chrome. в чем смысл этой техники, если вы не можете использовать ее на отзывчивых изображениях, в которых нуждаются 99% из нас.
Комментарии:
1. возможно, вы что-то делаете не так в своем «коде».
2. @Bravo с «кодом» вы имеете в виду html? потому что все, что требуется для изначально ленивой загрузки, — это добавить loading=»ленивый» в ваш тег img, и для части размеров: это мой вопрос. есть ли обходной путь или мне следует использовать стороннюю библиотеку для ленивой загрузки изображений, если я не знаю высоту или ширину.
3. вы отметили «javascript» и «html» … итак, я предполагаю, что оба — вы рассматривали возможность использования
<img srcset=.... sizes=....— developer.mozilla.org/en-US/docs/Learn/HTML/…