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 76% with WebP, against 69% for JPEG and 70% 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 76%, PNG at 70%, JPEG at 69%. 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 111 ms, WebP in 156 ms, PNG in 181 ms, JPEG in 184 ms. AVIF and WebP sites also start with a faster Time to First Byte: 406 ms on AVIF and 713 ms on WebP, against 980 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%63%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 61% for JPEG and 62% 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 111 ms. WebP needs 320 KB/MP (156 ms load time), JPEG needs 678 KB/MP (184 ms load time), and lossless PNG needs 1,424 KB/MP (181 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, 69% good LCP) and 5.9% are PNG (183 KB median, 70% good LCP). Switching to WebP (50 KB median, 76% good LCP) or AVIF (32 KB median, 94% good LCP) cuts median load time from 184 ms to 156 ms and 111 ms.
By Arjen Karel · 9,570 crawled React sites (5,488 with phone Chrome field data, 6,874 sites with an image LCP by image format, October 2026). How we measured.