LCP image format on React sites
JPEG, WebP, PNG, AVIF, SVG, or GIF on the LCP image: how much each format weighs (32 KB on AVIF vs 169 KB on JPEG) and how that changes LCP.
On React, 19.5% of LCP images are still served as JPEG. WebP accounts for 13.3%, PNG for 5.9%, and AVIF for 60.4%. When the LCP image is AVIF, 94% of sites have a good LCP and 78% with WebP, against 67% for JPEG and 67% for PNG. Switching from JPEG to WebP or AVIF cuts median hero image transfer weight from 169 KB to 50 KB (WebP) and 32 KB (AVIF).
LCP pass rate
By LCP image format, React sites have a good LCP at AVIF at 94%, WebP at 78%, PNG at 67%, JPEG at 67%. Within React, WebP and AVIF beat JPEG and PNG because smaller next-gen files finish downloading faster and reduce image load duration.
LCP image format usage
Images (<img> tags plus CSS background-image rules) are the LCP element on 75.2% of audited React sites. Across the 6,874 React sites with an image LCP element, JPEG serves 19.5%, WebP serves 13.3%, PNG serves 5.9%, AVIF serves 60.4%, SVG serves 0.6%, and GIF serves 0.3%.
LCP image weight and pixel efficiency by format
AVIF serves the largest median rendered hero image (0.22 MP) at the smallest file size: 32 KB median (53 KB at p75), or 157 KB per megapixel. Median file size is 50 KB for WebP (320 KB/MP), 169 KB for JPEG (678 KB/MP), and 183 KB for PNG (1,424 KB/MP). Nearly half of all PNG (47.9%) and JPEG (45.4%) LCP images weigh over 200 KB, against 10.5% of WebP and 0.6% of AVIF.
Resource load time and the four LCP phases by image format
Smaller image files reduce resource load duration: AVIF downloads in a median 139 ms, WebP in 159 ms, PNG in 171 ms, JPEG in 168 ms. AVIF and WebP sites also start with a faster Time to First Byte: 416 ms on AVIF and 657 ms on WebP, against 1015 ms on JPEG. That gap comes from edge CDNs, which both convert images to modern formats and cache the HTML response.
LCP image format per platform
Wix serves AVIF on 98% of its image-LCP sites, and 94% of Wix sites have a good LCP.
Wix 4,163 sitesAVIF 98%94%
WordPress 1,661 sitesJPEG (jpg) 57%WebP 24%PNG 16%61%LCP image format or the platform
Does the platform explain the AVIF and WebP pass rate?
On WordPress, 65% of sites with a WebP LCP image have a good LCP, compared with 59% for JPEG and 58% for PNG.
Why image format changes resource load time, not load delay
An LCP image spends time in four stages: Time to First Byte, resource load delay, resource load time, and element render delay. The image format only touches resource load time, the window between the first and last byte of the image file. At the median resolution in this dataset, AVIF packs a megapixel into 157 KB/MP and finishes downloading in 139 ms. WebP needs 320 KB/MP (159 ms load time), JPEG needs 678 KB/MP (168 ms load time), and lossless PNG needs 1,424 KB/MP (171 ms load time). Because PNG is lossless, photographic hero banners saved as PNG blow up to 732 KB at the 75th percentile.
Understanding LCP image format
Serve photographic LCP images as AVIF or WebP, and keep PNG for logos or flat graphics that need lossless pixels. You do not have to convert files by hand. An image CDN or a <picture> element with <source type="image/avif"> and <source type="image/webp"> lets each browser pick the smallest format it supports. Across this dataset, 19.5% of LCP images are still JPEG (169 KB median, 67% good LCP) and 5.9% are PNG (183 KB median, 67% good LCP). Switching to WebP (50 KB median, 78% good LCP) or AVIF (32 KB median, 94% good LCP) cuts median load time from 168 ms to 159 ms and 139 ms.
By Arjen Karel · 9,570 crawled React sites (9,110 with all devices Chrome field data, 6,874 sites with an image LCP by image format, October 2026). How we measured.