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.
WordPress Big Image Threshold and the 2048-Pixel srcset Limit
For a 5184-pixel upload, WordPress served at most a 2048-pixel file in srcset, used a 2560-pixel scaled copy as full size and kept the 2.8 MB original on the server, unused by pages.
WordPress Workflow 3 min read
What WordPress Writes When You Upload a Photo: Quality, Sampling and Metadata
On this host WordPress made every JPEG size with ImageMagick at exactly quality 82, baseline, 4:4:4 and without metadata, and its WebP sizes with GD. The 4:4:4 sampling cost 15 to 18 % extra.
WordPress Workflow 4 min read
Image Decode Time in Chrome: JPEG vs WebP vs AVIF vs PNG
Decoding a 1.8-megapixel photo took a median 17.6 ms as JPEG, 18.9 ms as WebP, 22.1 ms as AVIF and 22.9 ms as PNG, tiny next to the download time AVIF's smaller files save.
Browser Behaviour 3 min read
content-visibility: auto on a 1,000-Card Image Gallery
content-visibility: auto brought first paint and LCP forward by about 23 % and cut layout during load by 42 %, but more than doubled the layout work done while scrolling to the end.
Performance Lab 3 min read
HTTP/2 vs HTTP/1.1 for a Grid of Thumbnails
Over HTTP/2, grids of 12 to 72 thumbnails finished 13 to 16 % sooner than over HTTP/1.1 on a throttled connection, but the first image arrived up to almost six times later.
Performance Lab 3 min read
Cache-Control for Images: Repeat Visits With no-store, ETag and immutable
On a throttled connection, a repeat visit to a page of eight photos took 2.68 s with no-store, 0.54 s with no-cache and an ETag, and 0.22 s with a one-year immutable policy.
Performance Lab 3 min read
CMYK JPEGs on the Web: File Size and Colour in Chrome
CMYK JPEGs were three to four times larger than sRGB versions without a profile, and up to 21 times larger with sharp's 939 KB print profile embedded. Their colours shifted visibly in Chrome.
Formats & Compression 3 min read
EXIF Orientation: Why Stripped or Converted Photos Turn Sideways
Chrome 155 displayed a tagged camera photo upright as an image, a background and on a canvas. Stripping metadata or converting to WebP without rotating first left it on its side.
Browser Behaviour 3 min read
Which Favicon Files Does Chrome Download?
Chrome 155 fetched one icon per page: the SVG when declared, the 32-pixel PNG when sizes were given, /favicon.ico when nothing usable was declared, and 480 KB when the only icon was a 512-pixel PNG.
Browser Behaviour 3 min read
Do Blurred Placeholders Improve LCP? Four Techniques Tested
Chrome 155 never counted a blurred placeholder as the LCP element. In every setup LCP was the full photo at 1,300 to 1,316 ms; a script-swapped src started the real image slightly later.
Browser Behaviour 3 min read
Fade-In Effects and LCP: Which Entrance Animations Delay It
A hero faded in by JavaScript after loading reported LCP 1,027 ms after the image arrived. CSS keyframe fades, a transform slide-in and an early reveal did not delay LCP in Chrome 155.
Browser Behaviour 3 min read
Low-Content Images and LCP: Testing Chrome’s 0.05 Bits-per-Pixel Rule
Chrome 155 ignored a hero image at 0.039 bits per pixel and counted one at 0.051, confirming the low-content threshold that keeps placeholders and flat backgrounds out of LCP.
Browser Behaviour 3 min read
Which Elements Count as LCP? img, Background, Poster, SVG and Canvas Tested
Chrome 155 counted a hero as LCP when it was an img, a CSS background, a video poster or an SVG image element. On a canvas, in an iframe or as a gradient it was ignored, and LCP stayed at the text.
Browser Behaviour 3 min read
Preloading Responsive Images: How a Mismatch Causes Double Downloads
A preload with only href, or with an imagesizes value that did not match the image, made Chrome 155 download two files and finish the hero image about a second later on a throttled connection.
Browser Behaviour 3 min read
Display P3 Photos and ICC Profiles: What Stripping the Profile Does
An ICC profile cost about 480 bytes. Removing it from Display P3 photos shifted colours by a median ΔE of 1.1, up to 2.3, and cut colourfulness by 12 % in Chrome.
Formats & Compression 3 min read
Blurred Image Placeholders (LQIP and BlurHash): How Small Can They Be?
A 24-pixel WebP placeholder took a median 160 bytes, less than half a JPEG or AVIF of the same size, while a BlurHash string took only 28 characters.
Performance Lab 3 min read
Base64 Data URIs: Does the 33 % Overhead Survive Compression?
After Brotli, Base64 added under 1 % to PNG and JPEG images, but about 70 % to SVG icons. Embedding SVG as text instead kept the penalty to 15 to 26 %.
Formats & Compression 3 min read
Charts as SVG, PNG, WebP or AVIF: What Each Format Costs
Our bar and line charts were 0.8 KB as Brotli-compressed SVG and 21 to 45 KB as raster images at 1×, doubling at 2×. SVG was 26 to 140 times smaller than any raster format.
Formats & Compression 3 min read
SVG and HTTP Compression: gzip vs Brotli on 28 Files
Our 28 SVG files shrank from 1,622 KB to 418 KB with gzip and 339 KB with Brotli, far more than SVGO alone saved. Our host compressed SVG automatically; here is how to check yours.
Formats & Compression 3 min read
SVGO on Real SVG Files: Savings and Visual Safety
SVGO cut public-domain SVGs from drawing programs by a median 21 to 38 % and by 15 to 18 % after Brotli, with no visible change in our renders. Files written by code saved only 2 to 4 %.
Formats & Compression 4 min read
Image Width vs File Size: What Halving the Dimensions Saves
Halving an image's width cut the file to about 31 % of its size, not 25 %: across 20 photos, bytes grew with pixel count to the power of 0.84 in JPEG and WebP and 0.82 in AVIF.
Responsive Delivery 3 min read
WebP and AVIF for Thumbnails: Do the Savings Hold at Small Sizes?
At equal quality, AVIF stayed about 30 % smaller than MozJPEG from 160 to 1600 pixels wide, while WebP went from no saving at 1600 pixels to 12.5 % at 160.
Formats & Compression 3 min read
oxipng Optimisation Levels: Bytes Saved vs Time
oxipng's default level 2 saved 12.6 % on screenshots in under a second per image. Higher levels added at most half a percent, and Zopfli one more percent for about a minute per file.
Formats & Compression 3 min read
PNG for Photos: How Much Bigger Than JPEG?
Saved as PNG, our 20 photos were a median 14.5 times the size of a MozJPEG at quality 85. Maximum PNG compression and lossless WebP still left them 8 to 10 times larger.
Formats & Compression 3 min read
Palette PNG (Quantisation) vs Full-Colour PNG vs WebP
A 256-colour palette PNG made our screenshots 65 % smaller with a quality score above 90, smaller than lossless WebP. For transparent graphics, lossless WebP was smaller and exact.
Formats & Compression 4 min read
Sharpening After Resizing: What It Costs in File Size
Light sharpening at sigma 0.5 made resized photos 14 to 22 % larger, and sigma 1.0 added 29 to 47 %, with WebP and AVIF hit harder than JPEG.
Formats & Compression 3 min read
Resize Kernels Compared: Lanczos3, Mitchell, Linear and More
The resize kernel changed 400-pixel thumbnails by up to 30 % in file size: linear and mitchell were 15 to 18 % smaller than lanczos3 but softer, and nearest-neighbour was 30 % larger.
Responsive Delivery 4 min read
10-bit vs 8-bit AVIF for Ordinary Images: Size, Quality and Speed
10-bit AVIF made a smooth gradient 10 to 21 % smaller and 4 to 5 points better, and photos about 3 % smaller at equal quality, for roughly a third more encoding time.
Formats & Compression 3 min read
Greyscale JPEG vs Colour JPEG for Black-and-White Photos
Saving black-and-white photos as one-channel greyscale JPEGs made them only 1.2 to 2.3 % smaller than colour JPEGs at identical quality. WebP ranged from 47 % smaller to 28 % larger.
Formats & Compression 3 min read
cwebp Presets Compared: Do photo, picture and text Make a Difference?
At equal quality on 20 photos, cwebp's picture preset saved 2.0 % and photo 0.9 %, while icon and text needed 5.8 % more bytes. The default preset produced exactly the same files as no preset.
Formats & Compression 3 min read
WebP Near-Lossless: Smaller Than Lossless, Cleaner Than Lossy?
Near-lossless WebP at level 60 made screenshots 13.2 % smaller than lossless WebP with a SSIMULACRA2 score of 94. For photographs it stayed almost four times larger than lossy quality 90.
Formats & Compression 3 min read
Matching Quality Settings Across JPEG, WebP and AVIF
For the same visual quality on 20 photos, MozJPEG and WebP needed nearly the same quality number, about 73 to 74, while AVIF needed a setting 15 to 20 points lower, about 54.
Formats & Compression 3 min read
MozJPEG vs Default JPEG Settings: 20 Photos at Equal Quality
At the same SSIMULACRA2 score, MozJPEG settings saved a median 15.1 % over sharp's default JPEG settings, with every photo at least 10.7 % smaller, for about four times the encoding time.
Formats & Compression 3 min read
CSS image-set() With type(): Which Background File Chrome Downloads
image-set() with AVIF listed first made Chrome 155 download a 24.2 KB AVIF instead of the 54.1 KB JPEG, with a single request, even when a plain url() fallback was declared first.
Responsive Delivery 3 min read
Lazy-Loaded iframes: Chrome Loads Them Twice as Far Ahead as Images
Chrome 155 loaded lazy iframes up to 2,400 pixels below the fold and lazy images up to 1,200 pixels, identically on phone and desktop and on fast and throttled networks.
Browser Behaviour 3 min read
Lazy Loading in a Horizontal Carousel: How Far Ahead Chrome Loads
In a sideways-scrolling carousel, Chrome 155 fetched lazy images only about 600 pixels beyond the visible edge: 4 of 24 slides on a phone and 7 on a desktop before any swipe.
Browser Behaviour 3 min read
Does Chrome Reuse a Larger srcset Image From Its Cache?
Chrome 155 never downgraded an image on the same page, but a new visit on a narrow screen downloaded the small file although the large one was cached. A reload fetched the small file and still showed the large one.
Browser Behaviour 4 min read
srcset x vs w Descriptors: Which File Chrome Downloads at Each Pixel Ratio
For a 400-pixel image, x descriptors and w descriptors with sizes=400px chose the same files up to 3×. A sizes value of 100vw made a 1280-pixel window download a file 7.4 times larger.
Responsive Delivery 3 min read
Chrome’s Accept Header for Images and What It Means for Format Negotiation
Chrome 155 sent the same Accept header, starting with image/jxl, for every image request except fetch(), which sent */*. Our WordPress host ignored the header and served the same file to all.
Browser Behaviour 4 min read
How Chrome Chooses a Source in the picture Element
One request per picture element, always the first supported type: listing WebP before AVIF cost 61 % more bytes for the same photo. Chrome 155 also accepted a source marked image/jxl.
Browser Behaviour 4 min read