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.