Speed Lab: measured experiments
Controlled tests on our own pages: one change at a time, measured with Lighthouse, with the method shown so you can repeat them.
These are tests on pages we built for the purpose, not on customer sites. Each one changes one thing and measures it several times, and shows the method so you can repeat it. The results are medians of nine runs, with the lowest and highest value shown, and every test says plainly what it cannot tell you. Read how the Speed Lab tests are run first if you want the setup and the rules for reading the tables.
Results so far
| Test | What changed | What it found |
|---|---|---|
| Lazy-loading the main image | loading="lazy" on the hero image | Largest Contentful Paint 311 ms later with the lab's usual throttling, and no later on a network with a 150 ms round trip. A script-based lazy loader cost 611 ms and 274 ms |
| fetchpriority and finding the main image | The hero as an img, a CSS background or a script-inserted image, with and without a preload, and with fetchpriority | A CSS background cost 298 ms and a script-inserted image 587 ms (16 and 258 ms on a network with a 150 ms round trip). A preload cancelled both. fetchpriority changed nothing over HTTP/1.1. Over HTTP/2, low priority on competing images let the main image finish 264 ms sooner |
| JPEG, WebP and AVIF compared | One photograph in five formats at matched quality | AVIF was 45% smaller and 199 ms sooner than JPEG. A PNG of the same photo was 18 times larger. Sending a smaller file to the phone gained more than the format did: 276 ms against 202 ms |
| No compression, gzip and Brotli | The same page of HTML, CSS and JavaScript sent four ways | gzip painted 2.4 seconds sooner than no compression. Brotli at the top level was 202 ms sooner again, but took hundreds of milliseconds to compress each file |
| Blocking, deferred and async scripts | The same two scripts placed five ways | A blocking script in the head delayed the first paint by 486 ms. defer, async, a module and the end of the body were equal |
| Font swap and fallback metrics | One web font with swap, block, optional, a preload and a matched fallback font | swap shifted the page by 0.042. A matched fallback halved it. optional gave 0 but kept the fallback font. block delayed the main text by 669 ms. A preload made the first paint 108 ms later, and 103 ms later on a realistic network |
| Cookie banners and layout shift | A consent banner pushed in, with a placeholder, as an overlay and in the HTML | A banner inserted at the top after load scored a layout shift of 0.188. An overlay and a banner in the HTML scored 0. A placeholder that was 30 px too short scored 0.025 |
| content-visibility on a long page | A page of 140 product blocks drawn in full, with content-visibility: auto and a size estimate, and with no estimate | Style and layout work fell from 339 ms to 32 ms and blocking time from 166 ms to 0. With no estimate the page was 40% of its true height and the browser drew 51 blocks in the first frames |
| Many small files, HTTP/1.1 and HTTP/2 | The same page as 62 requests or 40, over HTTP/1.1 and over two HTTP/2 servers, on three kinds of slowed network | On a shaped network over HTTP/1.1, merging the files made the first paint 335 ms sooner and the finish 518 ms sooner. Over HTTP/2 the two pages finished within 21 ms of each other. Lighthouse's usual throttling put the cost of the extra files at two seconds |
| Inlining critical CSS | A Bootstrap page with its style sheet in the head, and with the first screen's CSS inlined and the rest loaded later two ways | The first paint came about 800 ms sooner with applied throttling and about 400 ms sooner on a network with a 150 ms round trip. The price was a layout shift of 0.018, 31 to 40 ms of blocking time and 3.6 KiB more to send |
| Three ways to slow a test down | The same changes measured with Lighthouse's simulation, with applied throttling and on a shaped network | The three methods agreed on direction for some changes and not others. The usual lab method gave the largest numbers for chains of requests, and only the shaped network showed a server's order of sending files |
Guides in this topic 12 guides
- How the Speed Lab tests are run
The tools, settings and rules behind every Speed Lab test: what is measured, how runs are repeated, how to read medians and ranges, and what tests cannot show.
- Speed Lab: fetchpriority and finding the main image
Two controlled tests of how the main image loads: how the browser finds it (HTML, CSS or script, with and without preload) and what fetchpriority adds.
- Speed Lab: lazy-loading the main image
A controlled test of lazy loading on the main image: five variants, nine Lighthouse runs each, medians, ranges and the moment the image request starts.
- Speed Lab: no compression, gzip and Brotli
A real page of HTML, CSS and JavaScript sent uncompressed, with gzip and with Brotli at two levels: bytes, time to first paint and what compression costs.
- Speed Lab: blocking, deferred and async scripts
The same two scripts placed five ways: blocking in the head, defer, async, a module and the end of the body. First paint, blocking time and when the code runs.
- Speed Lab: JPEG, WebP and AVIF compared
One photograph saved as JPEG, mozjpeg, WebP, AVIF and PNG at matched quality, then loaded as the main image: file sizes, a quality score and LCP from nine runs.
- Speed Lab: font swap and fallback metrics
Montserrat loaded with swap, block and optional, with a preload, and with a fallback font matched to its size and line metrics: layout shift and first paint.
- Speed Lab: cookie banners and layout shift
A consent banner that pushes the page, one with reserved space, an overlay and one in the HTML, tested for layout shift, first paint and the largest paint.
- Speed Lab: content-visibility on a long page
A page of 140 product blocks drawn in full and with content-visibility auto, with and without a size estimate: layout time, first paint and the scroll bar.
- Speed Lab: inlining critical CSS
A Bootstrap landing page with its style sheet in the head, and with only the first screen's CSS inlined: first paint on two networks, layout shift and cost.
- Speed Lab: many small files, HTTP/1.1 and HTTP/2
The same CSS, scripts and images as 62 requests or 40, over HTTP/1.1 and HTTP/2 on three kinds of slowed network: first paint, the finish and the server's part.
- Speed Lab: three ways to slow a test down
The same Speed Lab changes measured with Lighthouse's simulation, applied throttling and a shaped network: where the answers agree and where they differ.
Start here
Free website audit
Live Google data for any public page: mobile and desktop.
Mobile + desktop · Lighthouse lab test · Real-user Chrome data when Google has it
Rather have this done for you? Speed optimization · Book a call