lazy loading
Also called: lazyload, lazy load, native lazy loading
Lazy loading defers loading offscreen resources, typically images and iframes, until a user scrolls near them, which cuts initial page weight and speeds load time. The modern method is the native HTML loading="lazy" attribute, which needs no JavaScript.
Lazy loading solves a simple problem: a page that ships every image up front is slow, even for images the visitor never scrolls to. Deferring those offscreen assets shortens the critical rendering path and lowers the initial payload.
Native beats a script
For images and iframes, the one-line native attribute is what Google and web.dev recommend:
<img src="hero.jpg" loading="lazy" width="800" height="600" alt="...">It works in current Chrome, Edge, Firefox, and Safari with no library. Chrome begins fetching roughly 1,250px before an image enters the viewport on fast connections, so the picture is usually ready by the time you reach it.
Two rules keep it from backfiring. First, never lazy-load your above-the-fold or LCP image; delaying the largest visible element hurts the Core Web Vitals score you are trying to improve. Second, always set width and height (or CSS aspect-ratio) so the browser reserves space and you avoid layout shift.
For SEO the trap is JavaScript. Googlebot renders pages but does not scroll or click, so anything that only loads on a scroll event stays invisible. Use IntersectionObserver, keep a real src (not just data-src), and confirm the image appears in the rendered HTML using Search Console’s URL Inspection tool.
How it affects your traffic
Done right, lazy loading trims page weight and improves LCP and INP, the Core Web Vitals signals tied to rankings and to the crawl budget Googlebot spends on your site. Done wrong, it hides product images, thin-slices your indexable content, or tanks LCP by deferring the hero, and you lose impressions you already earned. Checking which assets defer, whether they carry a real src value, and whether Google actually renders them is core technical-SEO work. Our Technical SEO service catches these render-and-index gaps before they cost traffic.
Get Technical SEO that moves the needle
We turn terms like this into ranked pages and qualified pipeline. Start with a free Initial SEO Strategy.