Путешествие во времени с loading lazy

Второй раз за месяц сталкиваюсь с loading lazy в изображениях.

Сначала, когда оптимизировал микрофронтенд.

Спойлер: речь не про метрику LCP 🤫

Узнать про LCP и чем занимался 👇 Как браузер рисует страницы Анализ загрузки страницы LCP попытка улучшить метрику LCP

Затем, когда готовился к собеседованию разработчика.

Было интересно вспомнить, как раньше жили без loading="lazy"🧐

Начнем от современных к олдовым.

Можно через Intersection Observer. API, которое помогает понять, находится элемент в области видимости или нет 👀

Еще вариант: отслеживать прокрутку к изображению через событие scroll.

Конечно, не обойтись без библиотек:

  • lazysizes
  • lozad.js
  • jquery lazy

Кстати, loading="lazy" внутри реализован через Intersection Observer 🤓

Как вам путешествие во времени?

Есть еще способы, но решил перечислить только основные.

Путешествие во времени с loading lazy
Второй раз за месяц сталкиваюсь с loading lazy в изображениях.
Сначала, когда оптимизировал микрофронтенд | Сетка — социальная сеть от hh.ru