#фишка дня

Обратите внимание на иллюстрацию, если я её не сильно зашакалил, конечно. Ничего интересного не замечаете?

Действительно, три раза гружу страницу и три же раза подгружается разное число изображений.

Все изображения при этом имеют атрибут loading=“lazy”, знаменитая “ленивая” загрузка. Грузятся только те изображения, что видны. И ещё те, до которых вы (вероятно) планируете скроллить.

Так вот, три раза — разное число. Почему же?

И тут кроется самое интересно: первый — без троттлинга (замедления) сети, второй — Fast 3G, третий — Slow 3G.

Т. е. Chrome грузит тем больше картинок, чем медленнее сеть. Казалось бы, где логика? Но давайте подумаем. Slow 3G редко значит “просто медленно”, скорее всего — ваше соединение нестабильно (поезд, метро). А ничего так не раздражает на нестабильном соединении, как ожидание ленивой подгрузки изображений.

Такая вот казалось бы вывернутая наизнанку логика, не лишённая изящества.

Попробуйте сами: https://mathiasbynens.be/demo/img-loading-lazy

#chrome #lazy #img

#обман дня

Не так давно мы с вами радостно приветствовали введение штатной «ленивой» загрузки для тегов img и iframe. Был добавлен атрибут loading, который может принимать значение lazy и eager. Перевод, думаю, не требуется.

И блоги разработчиков и соиздателей браузеров радостно кричали: «Теперь ленивая загрузка картинок возможна даже при отключённом в браузере JS». Пруф (04.09.2022): https://web.dev/browser-level-image-lazy-loading/#:~:text=still%20works%20even%20if%20javascript%20is%20disabled

Хрена с два. Мы тут с пользователем Твиттера Стефаном Юдисом выяснили, что ленивая загрузка в Chrome таки отключается. Как и обещал нам MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-loading

Статья в блоге Chrome на днях будет исправлена. А вы пока попробуйте предположить, почему так. Это очень забавно.

#js #lazy #img