Skip to main content
ModPageSpeed 2.0: AVIF, WebP, and critical CSS — up to 69% less page weight on the live demo

Lighthouse audit reference

Improve your PageSpeed Insights score at the server layer

PageSpeed Insights runs the Lighthouse audits and reports which ones a page fails. Some of those failures are delivery problems that live below your application — render-blocking CSS, oversized images, weak cache headers — where a server-layer optimizer applies. Others are in your own JavaScript. This page maps each common audit onto what ModPageSpeed does about it, marks every claim auto-fix, assistive, or client-side, and links a real before/after for the ones it fixes.

PageSpeed Insights and Lighthouse are products of Google LLC. ModPageSpeed is built by We-Amp B.V. and is not affiliated with or endorsed by Google. The Analyze tool calls Google's public PageSpeed Insights API and reports its results.

Lab score versus field data

A PageSpeed Insights report has two halves, and it matters which one you optimize toward. The lab half runs a single synthetic Lighthouse test on a throttled machine: it produces the 0–100 Performance score and the opportunity audits below. The field half — shown when a URL has enough traffic — reports Core Web Vitals from real Chrome users over the trailing 28 days, the CrUX dataset. Google ranks on the field data. The lab audits are a diagnostic for what to fix; they are not themselves the ranking signal.

The two routinely disagree, because real visitors run slower hardware on slower connections than a lab run. Use the lab audits to find the problem, then verify the change moved the field number. The Core Web Vitals hub covers the field metrics in detail.


The audit map: what the server layer fixes

Each row is a Lighthouse audit and whether ModPageSpeed addresses it. Of the audits below, 9 are auto-fixes: ModPageSpeed handles them with no change to your markup. The rest are assistive (it helps but cannot fully resolve the audit) or client-side (the fix lives in your application or build step).

Auto-fix handled at the server, no markup change Assistive helps, but cannot fully resolve it Client-side application or build-step fix
Lighthouse audits and how ModPageSpeed addresses each, with coverage and the filter that applies
Audit Coverage What ModPageSpeed does
Eliminate render-blocking resources prioritize_critical_css, inline_css, inline_javascript Auto-fix Render-blocking CSS in the `<head>` is exactly what prioritize_critical_css targets: it extracts the above-the-fold rules, inlines them, and defers the rest. Small JS files inline directly. Caveat: prioritize_critical_css is marked "test first" — pages with complex CSS-in-JS or aggressive dark-mode swaps can flash unstyled content. Always inline a dark-mode override when using critical CSS. Before/after: prioritize_critical_css
Serve images in next-gen formats (legacy) convert_jpeg_to_webp, convert_to_webp_lossless, convert_to_webp_animated Auto-fix JPEG/PNG/GIF transcoded to WebP (and AVIF on 2.0) when the client advertises support via `Accept`. Before/after: rewrite_images
Properly size images (legacy) resize_images, resize_rendered_image_dimensions, responsive_images Auto-fix ModPageSpeed resizes images to the rendered dimensions and can generate a `srcset` for multiple resolutions. 2.0 generates viewport-tagged variants (Mobile/Tablet/Desktop, 1x/2x density) keyed off the request capability mask instead of using `srcset`. Caveat: `responsive_images` is "test first" — it changes the `<img>` markup and may interact with framework-rendered image components. Before/after: resize_rendered_image_dimensions
Efficiently encode images (legacy) recompress_images, recompress_jpeg, recompress_png Auto-fix Quality-aware recompression for JPEG, PNG, and WebP, with chroma subsampling tuned for the format. Before/after: rewrite_images
Use efficient cache lifetimes extend_cache Auto-fix ModPageSpeed rewrites static resource URLs to include a content hash and serves them with `Cache-Control: max-age=31536000, immutable`. Repeat visits skip the network entirely. Caveat: Only applies to assets MPS rewrites (images, CSS, JS that flow through filters). Origin HTML and resources behind `Cache-Control: no-store` are untouched. Before/after: extend_cache
Largest Contentful Paint prioritize_critical_css, inline_css, rewrite_images Assistive LCP is usually a hero image or above-the-fold text. ModPageSpeed transcodes the LCP image to WebP, resizes it to its rendered size, and removes render-blocking CSS via critical-CSS inlining. Caveat: If LCP is a video poster, a background-image set by JavaScript, or a font-rendered headline, image filters cannot help directly.
Avoid enormous network payloads rewrite_images, convert_jpeg_to_webp, rewrite_css Assistive The largest wins come from image transcoding (often 40–70% smaller). CSS/JS minification adds another 10–30%. Caveat: If the page is heavy because of video, fonts, or large JSON payloads, those are outside MPS’s scope.
Minify CSS rewrite_css Auto-fix ModPageSpeed minifies every CSS file it serves — removing whitespace, comments, and redundant syntax. CoreFilter; enabled by default. Before/after: rewrite_css
Minify JavaScript rewrite_javascript, rewrite_javascript_external, rewrite_javascript_inline Auto-fix ModPageSpeed minifies every JS file it serves, plus inline `<script>` blocks. CoreFilter; enabled by default. Before/after: rewrite_javascript
Image elements have explicit width and height insert_image_dimensions Auto-fix `insert_image_dimensions` reads the intrinsic dimensions of each image and adds matching `width`/`height` attributes to the `<img>` tag.
Cumulative Layout Shift insert_image_dimensions Assistive CLS from unsized images is the easy half: `insert_image_dimensions` measures each `<img>` and adds width/height so the browser reserves space before the bytes arrive. Caveat: CLS from injected ads, late-loading web fonts, or dynamic banners is application-level — MPS cannot fix layout shifts caused by JavaScript adding DOM nodes after first paint.
Defer offscreen images (legacy) lazyload_images Auto-fix lazyload_images defers loading of below-the-fold images until the user scrolls toward them. Caveat: "Test first" — interacts poorly with sites that already use native `loading="lazy"` or framework-controlled image components. Before/after: lazyload_images
Reduce unused CSS prioritize_critical_css Assistive `prioritize_critical_css` extracts the rules used above the fold and defers the rest — the deferred CSS still loads, but it is no longer render-blocking. Caveat: MPS does not delete unused CSS rules. True tree-shaking requires a build step (PurgeCSS, Tailwind JIT, etc.).

The auto-fix audits, configured

For the audits ModPageSpeed fixes outright, here is the configuration that turns each on and a link to the rewritten output. On mod_pagespeed 1.15 each optimization is a named filter directive; ModPageSpeed 2.0 has no filter directives — image transcoding, CSS/JS minification, and critical-CSS extraction run from the master switch, so the snippet is the same minimal block.

Eliminate render-blocking resources

Auto-fix

Render-blocking CSS in the `<head>` is exactly what prioritize_critical_css targets: it extracts the above-the-fold rules, inlines them, and defers the rest. Small JS files inline directly.

mod_pagespeed 1.15


                        pagespeed EnableFilters prioritize_critical_css,inline_css,inline_javascript,move_css_to_head;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
                      

See the measured before/after for prioritize_critical_css

Serve images in next-gen formats (legacy)

Auto-fix

JPEG/PNG/GIF transcoded to WebP (and AVIF on 2.0) when the client advertises support via `Accept`.

mod_pagespeed 1.15


                        pagespeed EnableFilters convert_jpeg_to_webp,convert_to_webp_lossless;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
                      

See the measured before/after for rewrite_images

Properly size images (legacy)

Auto-fix

ModPageSpeed resizes images to the rendered dimensions and can generate a `srcset` for multiple resolutions. 2.0 generates viewport-tagged variants (Mobile/Tablet/Desktop, 1x/2x density) keyed off the request capability mask instead of using `srcset`.

mod_pagespeed 1.15


                        pagespeed EnableFilters resize_images,resize_rendered_image_dimensions;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
                      

See the measured before/after for resize_rendered_image_dimensions

Efficiently encode images (legacy)

Auto-fix

Quality-aware recompression for JPEG, PNG, and WebP, with chroma subsampling tuned for the format.

mod_pagespeed 1.15


                        pagespeed EnableFilters recompress_images,jpeg_sampling;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
                      

See the measured before/after for rewrite_images

Use efficient cache lifetimes

Auto-fix

ModPageSpeed rewrites static resource URLs to include a content hash and serves them with `Cache-Control: max-age=31536000, immutable`. Repeat visits skip the network entirely.

mod_pagespeed 1.15


                        pagespeed EnableFilters extend_cache;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
pagespeed_cache_mode aggressive;  # opt in to long TTLs after validating output
                      

See the measured before/after for extend_cache

Minify CSS

Auto-fix

ModPageSpeed minifies every CSS file it serves — removing whitespace, comments, and redundant syntax. CoreFilter; enabled by default.

mod_pagespeed 1.15


                        pagespeed EnableFilters rewrite_css;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
                      

See the measured before/after for rewrite_css

Minify JavaScript

Auto-fix

ModPageSpeed minifies every JS file it serves, plus inline `<script>` blocks. CoreFilter; enabled by default.

mod_pagespeed 1.15


                        pagespeed EnableFilters rewrite_javascript;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
                      

See the measured before/after for rewrite_javascript

Image elements have explicit width and height

Auto-fix

`insert_image_dimensions` reads the intrinsic dimensions of each image and adds matching `width`/`height` attributes to the `<img>` tag.

mod_pagespeed 1.15


                        pagespeed EnableFilters insert_image_dimensions;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
                      

Defer offscreen images (legacy)

Auto-fix

lazyload_images defers loading of below-the-fold images until the user scrolls toward them.

mod_pagespeed 1.15


                        pagespeed EnableFilters lazyload_images;
                      

ModPageSpeed 2.0 (nginx)


                        pagespeed on;
pagespeed_cache_path /var/lib/pagespeed/cache.vol;
                      

See the measured before/after for lazyload_images

ModPageSpeed 2.0 generates up to 37 variants per image (format, viewport, pixel density, and a Save-Data path) and serves the right one per request, so the image audits clear for every device class, not just the one Lighthouse tested. The full set of 2.0 transforms is on the features page, and each optimization has a live before/after under examples.


What stays in your code

A server-layer optimizer rewrites bytes and markup as they pass through. It does not rewrite your application logic, so the audits below are out of scope. No server-layer module can fix INP for you; the fix is in your event handlers and framework code.

Interaction to Next Paint
INP measures responsiveness of user interactions after load. It is dominated by event-handler JavaScript and React/Vue re-renders — work ModPageSpeed cannot rewrite without breaking the application.
Reduce unused JavaScript
ModPageSpeed cannot determine at rewrite time which JS will be executed at runtime. Tree-shaking unused JS requires bundler-level code analysis.
Reduce the impact of third-party code
Third-party scripts (analytics, tag managers, ads, chat widgets) are loaded by the origin and run cross-origin. ModPageSpeed does not rewrite or proxy third-party JavaScript.
Font display
`font-display: swap` is a CSS property that must be declared in the `@font-face` rule by the origin or font provider. ModPageSpeed does not rewrite font-loading semantics.
Legacy JavaScript
Legacy JS means polyfills and ES5 transpilation shipped to modern browsers. Fixing it requires a `module/nomodule` build split at the application layer.
Duplicated JavaScript
Duplicated JS comes from bundlers shipping the same library twice (e.g., React in two chunks). Fixing it requires bundler configuration — MPS cannot deduplicate across separate compiled bundles.
Avoid an excessive DOM size
Large DOM size is a structural problem: too many elements, deep nesting, or oversized lists. Only the application can reduce it.

ModPageSpeed can reduce the competing startup script by minifying it and deferring what it can prove is safe to defer, which frees main-thread time around an interaction. It will not make a slow click handler fast. The INP guide covers the application-side fixes.


Score your own page first

Run a URL through our analyzer — it scores the page via Google's PageSpeed Insights API and badges each audit auto-fix, assistive, or client-side. Then install ModPageSpeed and clear the ones it owns. It optimizes immediately, licensed or not.

Production use requires a commercial license — but the software never locks you out.

PageSpeed Insights: common questions

What does PageSpeed Insights actually measure?
Two different things in one report. The lab section runs a single synthetic Lighthouse test on a throttled machine and produces the 0–100 Performance score and the opportunity audits. The field section, when there is enough traffic, shows Core Web Vitals from real Chrome users over the trailing 28 days (the CrUX dataset). Google ranks on the field data, not the lab score — the lab audits are a diagnostic for what to fix, not the thing being ranked.
How do I improve my PageSpeed Insights score?
Fix the opportunity audits the report flags, weighted by their impact. The byte-weight and delivery audits — render-blocking resources, next-gen image formats, properly sized images, efficient encoding, and cache policy — are delivery problems below the application, which is where a server-layer optimizer like ModPageSpeed applies. Audits rooted in your own JavaScript, such as INP, unused JavaScript, and third-party code, have to be fixed in the application or build step.
How do I eliminate render-blocking resources?
A render-blocking resource is a stylesheet or script in the <head> that the browser must fetch and parse before it paints. ModPageSpeed extracts the above-the-fold CSS rules, inlines them, defers the rest, and inlines small scripts, so the first paint no longer waits on the external stylesheet chain. This is an auto-fix in the audit map: prioritize_critical_css plus inline_css and inline_javascript.
How do I serve images in next-gen formats?
Next-gen formats means WebP and AVIF instead of JPEG, PNG, and GIF. ModPageSpeed transcodes images to WebP, and to AVIF on 2.0, when the requesting browser advertises support via the Accept header, and falls back to the original for browsers that do not. You do not re-author the markup; the server negotiates the format per request. Typical image savings are 40 to 70 percent at visually equivalent quality.
Does ModPageSpeed fix INP and CLS?
INP, no. Interaction to Next Paint is dominated by event-handler and framework JavaScript on the main thread, which a server-layer optimizer cannot rewrite without breaking the application. CLS, partly: the common case of layout shift from images without width and height is auto-fixed by injecting the dimensions, but shifts from late-loading fonts, injected ads, or content added by JavaScript after first paint are application-level and stay in your code.
Is the lab score or the field data what Google ranks on?
The field data. Core Web Vitals from real users (CrUX) are the page-experience signal; the lab Performance score is not a ranking factor on its own. The two routinely disagree because real visitors run slower hardware on slower connections than a lab test. Use the lab audits to find what to fix, but optimize toward the field number.

See also: