Page-wide image loading strategies and the Core Web Vitals
Eager above-the-fold (88.4%), eager below-the-fold (82.6%), CSS backgrounds (64.4%), lazy below-the-fold (42.4%), and lazy above-the-fold (21.0%): how page-wide image loading affects Largest Contentful Paint.
21.0% of sites use lazy above-the-fold image loading strategies, and 87% of those sites have a good LCP, against 86% of all sites.
LCP pass rate
Sites with lazy above-the-fold image loading strategies have a good LCP most often: 87%, against 86% of all sites. Sites with CSS background image loading have it least often, at 85%.
Image loading strategies usage
Eager above-the-fold is the most used: 88.4% of sites. Lazy above-the-fold is 21.0% of sites.
How page-wide image loading shifts the four LCP phases
Across the four LCP sub-parts in Chrome's field data, the largest gap between lazy above-the-fold and CSS background sits in resource load delay: 340 ms median for lazy above-the-fold against 280 ms for CSS background. Overall median field LCP is 1.4s for lazy above-the-fold (TTFB 553 ms, load delay 340 ms, load duration 121 ms, render delay 201 ms) versus 1.4s for CSS background.
Understanding image loading strategies
How browser viewport intersection gates lazy image fetches
Standard <img> elements without loading="lazy" are queued by the HTML preload scanner before layout runs (270 ms median LCP load delay on sites with eager above-the-fold images). When loading="lazy" is present on an image inside the initial viewport (21.0% of sites), Chromium withholds the network request until style and layout confirm viewport intersection, pushing median LCP resource load delay to 340 ms.
Keep above-the-fold hero and banner images eager while adding loading="lazy" to below-the-fold content and product grids. Across the web, 88.4% of sites ship eager above-the-fold images (86% good LCP, 270 ms load delay), 82.6% still leave below-the-fold images eager (86% good LCP), and 21.0% accidentally lazy-load an image inside the initial viewport (340 ms median load delay).
How image loading strategies plays out per platform
What the field data shows when you isolate a single CMS or framework.
WordPress sites have eager below-the-fold images on 93% of sites and lazy above-the-fold images on 18.7%.
WordPress 6.3+ adds loading="lazy" to content images while omitting it on the first three images. Across 65,875 WordPress sites, 76% with eager above-the-fold images pass LCP compared with 72% when an above-the-fold image has loading="lazy".
Shopify stores have eager above-the-fold images on 95%, lazy below-the-fold images on 80%, and lazy in-viewport images on 58%.
Shopify's Liquid image_tag filter accepts a loading parameter. Across Shopify storefronts, 95% have eager above-the-fold images, 80% have lazy below-the-fold images, and 58.4% have a lazy-loaded image inside the initial viewport (97% good LCP).
32.4% of React sites lazy-load at least one above-the-fold image.
Next.js <Image> components default to loading="lazy" unless priority or preload is passed. Across React sites, 96.7% render an eager image in the viewport and 32.4% have a visible viewport image with loading="lazy".
By Arjen Karel · 212,308 crawled sites (70,213 with desktop Chrome field data, 203,440 sites with image loading strategies, October 2026). How we measured.