Skip to main content
SparkCore

Improve PageSpeed Insights with media optimization

We solve many "Serve images in next-gen formats" and "Properly size images" issues at the plugin level.

Measurable results

Compare before/after in Lighthouse and in our live demo.

Which PageSpeed warnings relate to images

PageSpeed Insights and Lighthouse report a number of recurring issues that specifically concern images. "Serve images in next-gen formats" means an image is in an older format like JPEG or PNG when WebP or AVIF would be smaller. "Properly size images" points to images delivered larger than they are displayed on screen. "Efficiently encode images" concerns the compression setting of the file itself. And "Defer offscreen images" or a late Largest Contentful Paint indicates that images off-screen slow down the initial render, or that your most important image appears too late.

Step-by-step plan: from warning to green score

Open the report and note which image audits are failing

Run a test in PageSpeed Insights and write down which image-related audits are mentioned. This determines where you focus first.

Convert to next-gen formats where requested

Convert images to WebP or AVIF in places where the "next-gen formats" audit indicates, with a fallback for older browsers.

Serve images at the correct display size

An image that is 2000 pixels wide but displayed at 400 pixels uses unnecessary data. Make sure the actual file size matches the display size.

Lazy load offscreen images, except for your LCP image

Images that only become visible after scrolling can be deferred. Your most important, immediately visible image (usually the Largest Contentful Paint) should not be, otherwise you slow down that initial render.

Repeat the test and compare

Run the report again and compare the scores and load times with the previous test, preferably a few times, since measurements can fluctuate.

Formats and their impact on PageSpeed audits

Which approach affects which audit:
ApproachTypical savingsHelps most with
AVIFOften the largest savings; in our tests up to 94% smaller than the original."Serve images in next-gen formats" and "Efficiently encode images".
WebPSubstantial savings with broad support; usually 25 to 50 percent smaller than JPEG."Serve images in next-gen formats" as broad fallback.
Serve correct sizeVaries greatly depending on the situation; often the quickest win with an oversized hero image."Properly size images".
Lazy loading (non-LCP)No savings in bytes, but in initial load time."Defer offscreen images".

Common pitfalls when chasing a green score

  • Also lazy loading your LCP image, which actually slows down the initial render instead of speeding it up.
  • Only optimizing the hero image and forgetting the rest of the page.
  • Using a standalone optimization tool that doesn't work with your cache plugin, so visitors still see the old files.
  • Only looking at the number without checking actual load time and user experience.
  • Not doing a separate mobile test; PageSpeed Insights shows desktop and mobile separately, and mobile usually scores lower.

Frequently asked questions

No. Images are just one of the factors that PageSpeed measures; server response time, JavaScript, fonts, and external scripts also count. Optimizing images specifically addresses the image audits, but doesn't necessarily fix all other issues.

Lighthouse is the underlying auditing engine; PageSpeed Insights is an online tool that uses Lighthouse and can also display real field data from Chrome users.

Yes, you can compress it, but make sure that image doesn't load lazily. A smaller, directly loaded LCP image is usually the quickest win for that specific measurement.

That's usually a caching issue: your hosting cache, a cache plugin, or a CDN is showing a previously stored version. Purging the cache after a bulk run usually solves this.

Yes, the underlying files become smaller for all devices. Mobile often scores lower than desktop, simply because the measurement simulates a slower connection.

After major changes to content, theme, or plugins, a new measurement is advisable. Individual measurements can also fluctuate somewhat, so a single measurement isn't always representative.