Wix LCP resource discovery and the Core Web Vitals
HTML markup, CSS background-image, <link rel="preload">, JavaScript, or HTTP Link header: how the browser finds the LCP element and how much load delay each path adds.
On 98.8% of Wix sites, the browser finds the LCP element straight in the HTML. 1.1% hide it in a CSS stylesheet, and 0.1% inject it with JavaScript. Sites with the LCP element in HTML have a good LCP on 92% of sites (1.2s median), against 60% for CSS discovery (1.6s) and 100% for JavaScript discovery (1.6s).
LCP pass rate
Sites with HTML discovery have a good LCP on 92% of Wix sites, CSS discovery at 60%, and JavaScript discovery at 100%.
LCP resource discovery usage
On Wix, 98.8% of sites put their LCP element in the initial HTML markup. 1.1% (59 sites) put the LCP image inside a CSS background-image rule.
LCP phase breakdown by discovery path
How the browser discovers the LCP asset directly sets its resource load delay: HTML discovery after 478 ms, CSS discovery after 421 ms, JavaScript discovery after 518 ms.
LCP discovery path by element type
| Discovery path | <img> element | CSS background-image | Text block | <video> element |
|---|---|---|---|---|
| HTML document | 92% 3,930 sites | few sites | 92% 1,493 sites | 95% 100 sites |
| CSS background-image | few sites | 60% 59 sites | few sites | few sites |
| JavaScript injection | few sites | few sites | few sites | few sites |
LCP resource discovery per framework
React discovers the LCP element in HTML on 99% of its sites and in CSS on 1%, and 92% of React sites have a good LCP.
React 5,588 sitesHTML document 99%92%Understanding LCP resource discovery
Put the LCP image in the initial HTML as an <img> (or <picture>) element with fetchpriority="high". Do not hide hero images in CSS background-image rules or render them from client-side JavaScript. Across this dataset, 1.1% of sites put their LCP image in CSS, which adds 57 ms of resource load delay and drops good LCP from 92% to 60%. If a theme or page builder locks the hero into a CSS background-image, add <link rel="preload" as="image" fetchpriority="high"> in the <head> or send a Link: rel=preload HTTP header. The browser can then start downloading the image before the stylesheet arrives.
By Arjen Karel · 5,621 crawled Wix sites (728 with desktop Chrome field data, 5,589 sites with LCP resource discovery, October 2026). How we measured.