---
title: "Lazy-Loading Checker — Free Image & iframe Defer Audit"
description: "Free lazy-loading checker. Find images and iframes loading eagerly that should defer until scroll. See exact requests and KB you can save."
canonical: "https://lemwatch.com/tools/lazy-loading-checker"
source: "https://lemwatch.com"
---

# Lazy Loading Checker

> Find images and iframes that should be lazy-loaded. See how many requests you can defer below the fold.

Native lazy-loading is the single best one-line performance fix in the modern web. This checker scans your page for every image and iframe that could safely defer until the user scrolls, and flags the dangerous mistake of lazy-loading something above the fold.

 ## Why `loading="lazy"` finally works

 Browsers used to require JavaScript and Intersection Observer to lazy-load. As of 2020 every modern browser supports the native `loading="lazy"` attribute on `<img>` and `<iframe>` with zero JS, zero polyfill, and zero performance overhead. Adding it to a 50-image page can cut initial payload by 70% and bring LCP under threshold by itself.

 ## The LCP trap

 If you lazy-load the largest above-the-fold image — your hero, your product photo, your article featured image — the browser doesn't request it until layout completes. That delay shows up as a multi-second LCP regression, and Google ranks the page lower. The rule is simple: the LCP element gets `fetchpriority="high"` and never `loading="lazy"`. Everything below the fold gets `loading="lazy"`.

 ## Embeds are the worst offenders

 A YouTube embed is roughly 800KB of JavaScript and CSS that runs whether the user clicks play or not. A Google Maps iframe is 1MB+. A Twitter embed adds 200KB of CDN scripts. The `loading="lazy"` attribute helps, but the modern pattern is a click-to-load facade — a static thumbnail with a play button that swaps in the real embed only on click. lite-youtube-embed and similar projects deliver 99% of the experience at 1% of the cost.

 ## Background images need Intersection Observer

 CSS `background-image` doesn't respect `loading="lazy"` because it's applied via stylesheet, not markup. For below-the-fold hero sections styled with CSS backgrounds, use Intersection Observer to add the class that sets the background only when the section nears the viewport. This is the one place native lazy-loading still can't reach.

 ## What it doesn't do

 Lazy-loading is a deferral strategy, not a compression strategy. A 5MB image lazy-loaded is still 5MB when the user scrolls to it. Pair lazy-loading with image optimization (WebP/AVIF, correct dimensions, CDN delivery) to compound the win.

## What this tool checks

- Images missing `loading="lazy"` below the fold
- iframes loading eagerly (YouTube, maps, social embeds)
- Above-the-fold images incorrectly lazy-loaded (LCP risk)
- Total requests deferrable on initial load
- Estimated KB savings on first paint

## Why it matters

 Every below-the-fold image and iframe loaded eagerly steals bandwidth from the content the user actually wants to see. On image-heavy pages this can mean 50+ unnecessary requests blocking the LCP element.

## How to fix what it finds

- Add `loading="lazy"` to every `<img>` and `<iframe>` below the fold
- Use `fetchpriority="high"` on the LCP image — never lazy-load it
- Replace heavy embeds (YouTube, maps) with click-to-load facades
- For backgrounds, use Intersection Observer to defer the CSS
- Set explicit dimensions so lazy images don't cause CLS

## Methodology

 We render the page in a headless browser sized to a mobile viewport, capture every `<img>`, `<iframe>`, and CSS background-image, then classify each by viewport position at first paint. Anything fully below the fold without `loading="lazy"` is flagged as deferrable. Anything above the fold WITH `loading="lazy"` is flagged as a potential LCP risk (with the hero image given an extra warning). We estimate KB savings by summing the transfer sizes of all deferrable assets. The test runs at 360×640 viewport — the mobile baseline Google uses for ranking.

## Frequently asked questions

### Will lazy-loading hurt my SEO?

 Only if you lazy-load the LCP image or critical above-the-fold content. Below-the-fold lazy-loading helps SEO by improving Core Web Vitals.

### What's the difference between `loading="lazy"` and Intersection Observer?

 `loading="lazy"` is native, free, and works on `<img>` and `<iframe>`. Intersection Observer is JavaScript-based and required for CSS backgrounds, custom widgets, or fine-grained control over load thresholds.

### Do I need a polyfill for lazy-loading?

 No. Native support landed in Chrome 76, Firefox 75, and Safari 15.4. Older Safari users get the eager-loading fallback, which is fine.

### How do I lazy-load a YouTube video?

 Don't use a raw iframe. Use a click-to-load facade like lite-youtube-embed — it ships a static thumbnail, swaps in the real iframe on click, and saves ~800KB per embed.

### Does lazy-loading work for above-the-fold images?

 It loads them slightly later than eager — bad for LCP. Use `fetchpriority="high"` on above-the-fold images instead.


## Related

- [All free tools](https://lemwatch.com/tools)
- [Image Optimization Checker](https://lemwatch.com/tools/image-optimization-checker)
- [core web vitals checker](https://lemwatch.com/tools/core-web-vitals-checker)
- [Third Party Scripts Checker](https://lemwatch.com/tools/third-party-scripts-checker)
- [Font Loading Checker](https://lemwatch.com/tools/font-loading-checker)
- [Lemwatch pricing](https://lemwatch.com/pricing)
- [All monitoring checks](https://lemwatch.com/features)
- [llms txt generator](https://lemwatch.com/tools/llms-txt-generator)