Lazyload для html полей

Компонент организует "ленивую" загрузку изображений в html полях, обрабатываемых типографом.

Lazy loading – это метод оптимизации скорости загрузки медиафайлов, некритичных для отображения страницы или взаимодействия с пользователями. При «отложенной загрузке» изображения не будут загружаться, пока не понадобятся посетителю.

В текущей реализации, на мой взгляд, самая корректная "ленивая" загрузка. Во-первых, факт попадания изображения в поле зрения пользователя отслеживается с помощью API IntersectionObserver, которое встроено в браузер. Во-вторых, не меняется атрибут src, а используется тот факт, что

в случае если указан атрибут srcset то браузер показывает то, что в этом атрибуте, вне зависимости от того, что находится в атрибуте src.

Т.е. поисковик увидит в атрибуте src именно картинку, а не пиксельную заглушку, как в других реализациях.
И в третьих, добавлена проверка на поддержку API IntersectionObserver в браузере, и если ее нет, то компонент просто покажет все картинки пользователю как есть.

Скачать можно у меня в профиле /users/zau4man в файлах
Там же можно поблагодарить плюсиком в карму.

Установить по инструкции docs.instantcms.ru/manual/addons



Поставляется как есть.
Пожелания, баги можно писать тут.