Images are much larger than the space they are shown in
What this check looks for
‹count› image(s) on this page are downloaded at a far higher resolution than they are displayed at. Serving them at the size they are actually shown would save an estimated ‹savings bytes›.
Why it matters
Visitors on mobile connections pay for every one of those bytes in time and often in money, and the browser then throws the extra pixels away. It is the most wasteful weight on a typical page.
When the check passes, your report says: “Images are served close to the size they are displayed at”.
What it costs your score
When this check fails it removes 8 points from your Performance score, before the status, confidence and repeat multipliers are applied. Performance carries a weight of 8 in the overall score.
It shares the performance.assets family ceiling of 25 points: however many findings that family produces, together they cannot remove more than that from Performance. One underlying problem showing up in several places is still one problem.
- Severity
- medium
- Default confidence
- high
- Status when triggered
- warn
- Deduction
- 8 points
- Family cap
- performance.assets · 25
- Category
- Performance
- Module
- Perf lab
- Fix owned by
- user
- In the ruleset since
- 2026.09
How to fix it
Serve each image at the size it is displayed, per device.
You are sending an estimated ‹savings bytes› of pixel data that the browser discards before the visitor ever sees it.
Generate several widths of each image and offer them with
srcset, usingsizesto tell the browser how wide the image will be at each breakpoint.Cap the largest variant at roughly twice the maximum displayed CSS width — beyond 2× device pixel ratio the difference is not visible.
Set
widthandheightattributes on every image. It costs nothing and it also prevents the layout shift reported separately under Cumulative Layout Shift.If images are user-uploaded, put an image CDN or a build-time pipeline in front of them; hand-resizing does not survive contact with a content editor.
Check background images too — a CSS
background-imageis not covered bysrcset, and needsimage-set()or a media query.
How to confirm it worked
Re-run this scan and confirm the oversized-image count has dropped.
In Chrome DevTools, Network → Img, compare each transferred size against the rendered size shown in the Elements panel.
A named slot like ‹domain› — and the braces left in the configuration below — is filled in with your own values when this rule appears on a report.
Remediation by platform
<img
src="/photo-800.avif"
srcset="/photo-400.avif 400w, /photo-800.avif 800w, /photo-1600.avif 1600w"
sizes="(max-width: 700px) 100vw, 700px"
width="800" height="450"
alt="">sizesis the part people omit, and without it the browser assumes the image is full viewport width and picks the largest candidate — which reproduces the problem you were fixing. State the real displayed width.
Technical detail
Oversized images: ‹count›, estimated saving **‹savings bytes›**.
‹detail›
This came from **one page load we performed**, not from your visitors. A lab measurement is reproducible and tells you exactly which bytes and which resources are responsible — which is why the numbers below are byte counts and resource lists rather than a score. What real visitors experience is in the field-data section, which is the evidence this report scores Core Web Vitals on.
We compare each image's intrinsic dimensions against the size it is rendered at, accounting for device pixel ratio, and report the difference as wasted bytes. A 3,000-pixel-wide photograph displayed in a 600-pixel column is carrying roughly 25 times the pixel data it needs.
The fix is not one resize: it is letting the browser choose. srcset with sizes gives it a set of widths and tells it how wide the image will be at each breakpoint, so a phone fetches the phone-sized file and a desktop fetches the desktop one. Doing this by hand once is fine; doing it for a content site means an image pipeline or an image CDN, which is why this is filed as an hour of work rather than minutes.
Standards and references
Test this on your domain
Run the check that produces this finding, on its own, against any domain.
Other perf lab checks
- The page ships more JavaScript than it uses
- Images are served in older, heavier formats
- Lab measurement of one page load
- Stylesheets and scripts stop the page from rendering
- This report never publishes a headline performance score
- Static files are re-downloaded because they are barely cached
- Scripts and stylesheets are sent without compression
- The page was not measured in a browser