Отложено зареждане (lazy loading)
Какво е отложено зареждане (lazy loading)?
Отложено зареждане (lazy loading) е техника, при която изображенията, вградените видеоклипове и картите под първия екран се изтеглят едва когато посетителят стигне близо до тях при превъртане. Първоначалното зареждане олеква, а човек, който не стигне до края на страницата, не тегли файлове, които няма да види. Важно изключение: изображението в първия екран трябва да се зарежда веднага, иначе основното съдържание се показва по-късно.
Пример
Страница на категория в онлайн магазин показва 48 продукта, всеки със снимка от около 80 KB: 48 × 80 = 3 840 KB. На телефон първият екран побира 4 продукта. С отложено зареждане браузърът започва само с тези 4 снимки — 320 KB, плюс още няколко точно под екрана, а останалите тегли, докато човек превърта. Който разгледа първите два реда и отвори продукт, изобщо не изтегля останалите около 3 MB.
Същото важи за карта, вградена в страницата за контакти, или за видео от YouTube по-надолу в текста: те се зареждат, когато посетителят стигне до тях.
Защо има значение за бизнеса
Отложеното зареждане е едно от най-лесните подобрения на скоростта, затова го има като настройка в повечето теми и плъгини за кеш и много собственици го включват сами. Там е и най-честата грешка. Включено за всички изображения, то отлага и голямата снимка в първия екран: браузърът я поисква едва след като разбере, че е видима, и LCP — моментът, в който се появява основното съдържание — се влошава. PageSpeed Insights отбелязва този случай в анализа на LCP. Втората грешка е изображение без зададени ширина и височина: когато пристигне, съдържанието под него подскача, а това се отчита като изместване на оформлението (CLS).
Отложеното зареждане е част от мобилната оптимизация: на телефон с ограничени мегабайти разликата е най-голяма.
Какво да попитате
- Изключено ли е отложеното зареждане за изображенията в първия екран на всеки шаблон — начало, категория, продукт?
- Използва ли се вграденото в браузъра отложено зареждане (атрибутът
loading="lazy") или скрипт? Google препоръчва атрибута или скрипт, който зарежда съдържанието, щом влезе в екрана, защото Googlebot не превърта и не кликва. - Имат ли всички изображения зададени размери, за да не подскача страницата?
- Отлагат ли се и вградените карти и видеоклипове?
При оптимизацията на скоростта на сайта проверяваме това шаблон по шаблон, заедно с формата и размера на самите изображения.