Image formats on React sites

54.4% of audited sites (5,205) serve PNG images and 44.6% serve JPEG (77% good LCP), while 25.4% serve WebP (74% good LCP) and the 63.4% adopting AVIF reach 93% good LCP (1.2s median).

Field data PhoneDesktopAll Scope All sites October 2026 edition · Phone field outcomes · React sites only
React Scoped to 9,570 sites out of 210,902 analyzed (frameworks) Compare with all sites →

63.4% of React sites use AVIF images page image format mix, and 93% of those sites have a good LCP, against 84% of all React sites.

The State of Web Vitals · October 2026 · React: 9,570 crawled sites · 5,488 with phone field data · 9,561 sites with page image format mixBy Arjen Karel · corewebvitals.io/state-of-cwv
1

LCP pass rate

Sites with AVIF images page image format mix have a good LCP most often: 93%, against 84% of all React sites. Sites with WebP images image formats have it least often, at 74%.

SitesGood, needs improvement, poor LCPMedian
All React sites5,48884%1.4s
AVIF images 63.4%3,33293%1.2s
GIF images / beacons 75.0%4,07988%1.3s
SVG vector graphics 69.1%3,89383%1.4s
Other image formats 22.4%1,29779%1.7s
PNG images 54.4%3,10077%1.7s
JPEG images 44.6%2,54977%1.7s
WebP images 25.4%1,47574%1.8s
GoodNeeds improvementPoorSites: with Chrome field data
The State of Web Vitals · October 2026 · React: 9,570 crawled sites · 5,488 with phone field data · 9,561 sites with page image format mixBy Arjen Karel · corewebvitals.io/state-of-cwv
2

Page image format mix usage

GIF images is the most used: 75.0% of React sites. AVIF images is 63.4% of React sites.

Sites using each option (sites can use more than one) 9,561 sites
GIF images / beacons 75.0% SVG vector graphics 69.1% AVIF images 63.4% PNG images 54.4% JPEG images 44.6%
GIF images / beacons 75.0% SVG vector graphics 69.1% AVIF images 63.4% PNG images 54.4% JPEG images 44.6% WebP images 25.4% Other image formats 22.4%
The State of Web Vitals · October 2026 · React: 9,570 crawled sites · 5,488 with phone field data · 9,561 sites with page image format mixBy Arjen Karel · corewebvitals.io/state-of-cwv
3

LCP phase breakdown by image formats used on the page

Across the four LCP sub-parts in Chrome's field data, the largest gap between AVIF images and WebP images sits in time to first byte (TTFB): 408 ms median for AVIF images against 744 ms for WebP images. Overall median field LCP is 1.1s for AVIF images (TTFB 408 ms, load delay 449 ms, load duration 111 ms, render delay 152 ms) versus 1.8s for WebP images.

Median LCP phase breakdown (Chrome field p75) Load delay Median LCP
React sites with page image format mix 4,168502 ms433 ms180 ms433 mslab 439 ms1.4s
WebP images 1,154744 ms428 ms229 ms428 mslab 432 ms1.8s
PNG images 2,357632 ms435 ms209 ms435 mslab 440 ms1.7s
SVG vector graphics 3,011529 ms435 ms185 ms435 mslab 440 ms1.4s
Other image formats 1,023589 ms439 ms202 ms439 mslab 445 ms1.6s
GIF images / beacons 3,135451 ms439 ms439 mslab 447 ms1.3s
JPEG images 1,921714 ms448 ms216 ms448 mslab 447 ms1.7s
AVIF images 2,551408 ms449 ms449 mslab 456 ms1.1s
TTFB Resource load delay Resource load time Element render delay
The State of Web Vitals · October 2026 · React: 9,570 crawled sites · 5,488 with phone field data · 9,561 sites with page image format mixBy Arjen Karel · corewebvitals.io/state-of-cwv
4

Page image format mix per platform

Wix sets the page image format mix to AVIF images on 100% of its sites, and 94% of Wix sites have a good LCP, against 84% of all sites. WordPress sets the page image format mix to JPEG images on 87% of its sites, and 63% of WordPress sites have a good LCP.

PlatformPage image format mix on its sitesGood LCP
React sites with page image format mix 9,561 sitesGIF images / beacons 75%SVG vector graphics 69%AVIF images 63%PNG images 54%JPEG images 45%WebP images 25%Other image formats 22%84%
Wix 5,822 sitesAVIF images 100%GIF images / beacons 98%SVG vector graphics 69%PNG images 37%JPEG images 24%Other image formats 16%94%
WordPress 2,342 sitesJPEG images 87%PNG images 86%SVG vector graphics 73%WebP images 49%GIF images / beacons 39%Other image formats 25%63%
GIF images / beacons SVG vector graphics AVIF images PNG images JPEG images WebP images Other image formats
The State of Web Vitals · October 2026 · React: 9,570 crawled sites · 5,488 with phone field data · 9,561 sites with page image format mixBy Arjen Karel · corewebvitals.io/state-of-cwv
5

Image format mix or the platform

Does the platform explain the page image format mix difference?

Almost every site with AVIF images page image format mix is a Wix site, and almost every Wix site has AVIF images page image format mix, so the data can't tell AVIF images page image format mix and Wix apart. On WordPress, 62% of sites with AVIF images page image format mix have a good LCP, against 58% of WordPress sites with GIF images. Within WordPress, sites with AVIF images and GIF images have a good LCP about equally often.

How AVIF and WebP across the page cut transfer weight and free bandwidth for LCP

Even when the LCP element itself is optimized, legacy PNG and JPEG assets elsewhere in the viewport compete for bandwidth on the same connection. Across 6,057 sites (63.4%) serving AVIF images, 93% pass field LCP (1.2s median). WebP is present on 25.4% of sites (74% good LCP), whereas legacy PNG (54.4%, 77% good LCP) and JPEG (44.6%, 77% good LCP) remain on four out of five pages.

The State of Web Vitals · October 2026 · React: 9,570 crawled sites · 5,488 with phone field data · 9,561 sites with page image format mixBy Arjen Karel · corewebvitals.io/state-of-cwv
6

Understanding page image formats

Configure your image CDN or build pipeline to negotiate AVIF and WebP automatically via the Accept request header for every raster image on the page, reserving PNG and SVG strictly for logos and icons. Across all audited sites, 63.4% serve AVIF (93% good LCP, 1.2s median) and 25.4% serve WebP (74% good LCP).

The State of Web Vitals · October 2026 · React: 9,570 crawled sites · 5,488 with phone field data · 9,561 sites with page image format mixBy Arjen Karel · corewebvitals.io/state-of-cwv
Related signals Stylesheet origin (1P/3P) → Preloaded fonts → Stylesheet loading mix → Third-party share → By Arjen Karel · 9,570 crawled React sites (5,488 with phone Chrome field data, 9,561 sites with page image format mix, October 2026) · How we measured