What is lazy loading and should I use it?
Lazy loading tells the browser to hold off downloading images until the visitor scrolls near them, instead of fetching everything at once. It speeds up the initial load - with one important exception:
- It helps below-the-fold images - photos further down a long page only load when needed, so they do not compete with what the visitor sees first.
- Never lazy-load the hero image - the big image at the top is your LCP element; delaying it makes your most-watched metric worse.
- Most platforms do it for you - modern browsers and page builders lazy-load by default via the loading attribute on images.
Lazy loading is a clear win for image-heavy pages, as long as you exempt the one image visible on arrival. Lazy-load everything below the fold, but load the hero image eagerly - that one rule covers it.