Every guide on Image Load Lab answers one practical question with a test we ran: file size at equal visual quality, which file a browser actually downloads, how loading attributes change Largest Contentful Paint and layout shift, and what WordPress does with the images you upload. Each guide links its raw data.
Images in Closed details and dialog Elements: Downloaded or Not?
Chrome 155 downloaded images inside a closed details or dialog element at page load. With loading=lazy they were fetched only when opened, and template and noscript images never loaded.
Browser Behaviour 3 min read
Hidden CSS Background Images: Which Ones Chrome Still Downloads
Background images on display:none elements cost nothing in Chrome 155, unlike image elements. But visibility:hidden, zero-size and off-screen elements still downloaded the full 111.8 KB image.
Browser Behaviour 4 min read
Do Hidden Images Still Download? display:none and Lazy Loading in Chrome
Every hidden image without loading=lazy downloaded in full in Chrome 155, even inside display:none. Lazy loading stopped the download for five of six hiding methods, but not for visibility:hidden.
Browser Behaviour 5 min read
Before You Install an Image Plugin: Measure What It Could Save
At equal quality, converting WordPress's own JPEG sizes saved 5–25 % with WebP and 42–44 % with AVIF in our test. A checklist to run before installing a plugin.
WordPress Workflow 4 min read
WordPress Image Sizes: Which One Does the Browser Actually Download?
With WordPress's default sizes on an eager image, Chrome downloaded a 182 KB file for a 760-pixel desktop column; sizes=auto or a corrected rule took 53 KB.
WordPress Workflow 4 min read
What WordPress Creates When You Upload a Photo: 3 Uploads Measured
A 2.9 MB camera JPEG left eight files totalling 4,048,293 bytes on our server. The same photo uploaded as a 1600-pixel WebP used 280,622 bytes, 14 times less.
WordPress Workflow 4 min read
Auditing Every Image Request: What We Found on Our Own Pages
Our own audit found one lossless comparison panel making up 68 % of a guide's weight. Replacing it halved the page from 1,381 KB to 683 KB on a phone.
Performance Lab 5 min read
decoding=”async” Tested: Does It Change LCP or Blocking Time?
With four 2400-pixel AVIF images, decoding=async, sync and auto gave LCP within 16 ms of each other and no long tasks, with a normal and a 4× slower CPU.
Performance Lab 4 min read
fetchpriority and preload for the LCP Image: When They Help
fetchpriority and preload raised the hero request to High priority in Chrome 155, yet LCP did not change across 224 throttled loads over HTTP/1.1 and HTTP/2. Here is why.
Performance Lab 5 min read
Lazy Loading Measured: Bytes Saved and the Cost of a Lazy Hero
Lazy-loading the 12 photos below the fold cut initial image bytes from 1,652 KB to 372 KB and LCP by 39 % on mobile. Lazy-loading the hero too cost 160–244 ms.
Performance Lab 5 min read
Images Without width and height: Layout Shift Measured
Three images without dimensions gave an article a CLS of 0.15 on mobile, above the 0.1 'good' limit. width and height attributes or CSS aspect-ratio brought it to 0.
Performance Lab 4 min read
CSS Background Heroes vs img: How Much Later Does the Image Load?
Moving the hero image into an external stylesheet delayed its download by 186 ms and LCP by about 180 ms. An inline style or a preload link removed the delay.
Responsive Delivery 4 min read
Art Direction With picture: Crops and Bytes Measured on 3 Screens
A portrait crop for phones made the market sign readable at no extra cost: Chrome downloaded 51 KB instead of 53 KB, and larger screens were unaffected.
Responsive Delivery 4 min read
High-DPI Images: How Many Pixels Are Worth the Bytes?
In an 800-pixel slot on a 2× screen, the 2× file scored 70.1 while a 1.5× file fell to 28.8 for 40 % fewer bytes. Doubling the width cost 3.3 times the bytes.
Responsive Delivery 4 min read
srcset and sizes Measured: Which File Chrome Downloads on 3 Screens
A missing sizes attribute made Chrome download 64 KB instead of 16 KB on desktop for the same photo; on phones and tablets both srcset versions chose the same file.
Responsive Delivery 4 min read
Removing EXIF Metadata: What 20 Real Photos Contained and What It Saves
Five of 20 public photos still carried GPS data. Stripping metadata saved 0.25 % of the originals but a median 6.9 % (up to 27.5 %) of 1600-pixel web copies.
Formats & Compression 5 min read
SVG vs PNG for Interface Icons: Bytes and Sharpness Measured
Twelve line icons as one Brotli-compressed SVG sprite weighed 456 bytes, less than a single 48-pixel PNG of the clock icon, and stayed sharp at every screen density.
Formats & Compression 4 min read
PNG vs WebP for Transparency: Edges Tested on Three Backgrounds
Lossless WebP halved transparent PNGs with identical pixels. Lowering WebP alpha quality to 50 dropped one asset's score on a dark background from 83 to 9.
Formats & Compression 4 min read
JPEG Quality in the Browser: Chrome’s Canvas Encoder vs MozJPEG
At the same visual quality, Chrome's canvas JPEG encoder produced files a median 18.4 % larger than MozJPEG across 20 CC0 photos, and its quality 0.8 is not MozJPEG's 80.
Formats & Compression 4 min read
WebP vs AVIF vs JPEG at Equal Quality: 20 Photos Measured
At the same SSIMULACRA2 score, AVIF was smaller than MozJPEG for all 20 CC0 photos (median −29.4 %), while WebP was not smaller at the median. Screenshots told a different story.
Formats & Compression 6 min read