Theory is useful. Real numbers are better.
Over the last 12 months I’ve worked on quite a few sites that were stuck in the 40s and 50s on mobile PageSpeed. Almost every time the biggest single win came from fixing the images. Not from rewriting JavaScript, not from changing hosting, and not from removing half the plugins. Just the images.
In this post I’m sharing three real case studies (with the actual before-and-after scores) so you can see exactly what moved the needle.
Case Study 1 – SaaS Landing Page
This was a classic SaaS landing page. Clean design, good copy, but the mobile score was stuck at 42. The Largest Contentful Paint was over 4 seconds.
The main problem was obvious once we looked at the Network tab: the hero image was a 1.8 MB JPEG being served at almost full resolution even on phones. There were also three product screenshots that were each over 400 KB.
What we changed:
- Converted the hero and the three screenshots to AVIF (quality around 50–55) with WebP fallbacks
- Created three different widths for the hero (and used
srcset+sizes) - Added
fetchpriority="high"and properwidth/heightattributes to the LCP image - Removed one decorative background image that wasn’t really needed
That was basically it. No JavaScript changes. No font changes. No CDN switch. The score jumped from 42 to 94 on mobile and the LCP dropped from 4.1s to 1.7s.
The client was surprised it was “only” the images. That’s the point — images are still one of the highest-leverage things you can fix in 2026.
Case Study 2 – Content / Blog Site
This site publishes long-form articles with a lot of images. Every post had a large featured image plus several images inside the content. Most of them were high-resolution JPEGs straight from the camera or design tool.
We didn’t touch the content or the theme layout. We only worked on the images:
- Batch-converted everything to AVIF (quality 50) with WebP fallbacks
- Generated three widths for each image
- Updated the image template so it output proper
srcset,sizes,width,heightandloading="lazy"(except for the featured image)
Total image weight on a typical article dropped by about 62%. The mobile score went from 51 to 96 and LCP improved from 3.6s to 1.9s.
One interesting detail: the biggest single improvement still came from the featured image at the top of each post. Even on content sites, that first image is usually the LCP element.
Case Study 3 – E-commerce Category Page
Category pages are often the hardest because they load a lot of product images at once. This particular page had a score of 47 on mobile.
The product thumbnails were being served at much larger sizes than they were displayed, and everything was still JPEG. Lazy loading was also implemented poorly (some images below the fold were loading immediately).
After switching to responsive AVIF/WebP versions and fixing the lazy-loading behaviour, the score moved from 47 to 91. Visual quality stayed the same — most people couldn’t tell the difference in a side-by-side comparison.
Common Patterns Across All Wins
After doing this on quite a few sites, the same patterns keep appearing:
- The hero (or featured) image is almost always the LCP element
- Files are usually much larger than they need to be for the actual display size
- Modern formats (especially AVIF) still give the biggest size reductions
- Missing
widthandheightattributes cause layout shift - Missing
fetchpriority="high"on the LCP image delays rendering - Lazy loading is often applied to the wrong images (or not applied at all)
What We Deliberately Didn’t Touch
In all three case studies we limited the work to images only. We didn’t:
- Remove or defer JavaScript
- Change fonts or font loading
- Switch hosting or CDN
- Minify CSS or clean up the theme
This was intentional. We wanted to show how much pure image work is still worth in 2026. The results speak for themselves.
Practical Takeaways You Can Use Today
If your mobile PageSpeed is stuck in the 40s–60s and the site has large images, start here:
- Find the LCP image (usually the biggest one at the top of the page)
- Convert it to AVIF + WebP and serve the right size
- Add
width,heightandfetchpriority="high" - Do the same for the next few important images
- Make sure images below the fold are properly lazy-loaded
You don’t need to optimise every single image on the site on day one. Fixing the top 5–8 images often delivers most of the gain.
Image optimisation is still one of the highest-ROI performance jobs you can do. The tools are free, the technique is straightforward, and the results are very visible.