DOM tree depth and the Core Web Vitals
36.7% of audited sites (73,944) keep maximum DOM depth between 15 and 20 levels (93% good INP, 97ms median), while 30.6% nest 21 to 31 levels deep (93% good INP) and 4.7% reach 32+ levels (89% good INP).
36.7% of sites use 15 to 20 DOM levels maximum DOM depth, and 93% of those sites have a good INP, against 92% of all sites.
INP pass rate
Sites with 15 to 20 DOM levels maximum DOM depth have a good INP most often: 93%, against 92% of all sites. Sites with 32+ DOM levels DOM depth have it least often, at 89%.
Maximum DOM depth usage
15 to 20 DOM levels is the most used: 36.7% of sites.
Understanding maximum DOM depth
Why deeply nested wrapper chains slow down event bubbling and layout
Maximum DOM depth measures the longest chain of nested parent-child elements from the root html tag to the deepest leaf node. Across 73,944 sites (36.7%) at 15 to 20 levels, 93% achieve good INP (97ms median). Another 30.6% (61,639) nest 21 to 31 levels deep (93% good INP, 104ms median), while the 4.7% (9,533) exceeding 32 levels drop to 89% good INP (102ms median).
Keep maximum DOM nesting depth below 20 levels by replacing nested flex/column wrapper divs with CSS Grid and using fragments in component frameworks so component boundaries do not emit extra DOM containers. Across all audited sites, 36.7% sit at 15 to 20 levels (93% good INP) and 4.7% exceed 32 levels (89% good INP).
How maximum DOM depth plays out per platform
What the field data shows when you isolate a single CMS or framework.
WordPress 65,509 sites WordPress sites with 32+ DOM levels (3.9%) pass field INP at 94% vs 97% at 15 to 20 levels.
Across 65,509 WordPress sites, 39.2% have a maximum DOM depth of 15 to 20 levels (97% good INP), 42.0% have 21 to 31 levels (96% good INP), and 3.9% have 32+ levels (94% good INP).
Shopify 8,573 stores 98% of Shopify stores have fewer than 32 DOM levels, while 1.6% reach 32+ levels (80% good INP).
Across 8,573 Shopify stores, 44.4% sit at 15 to 20 DOM levels (95% good INP), 49.0% sit at 21 to 31 levels (92% good INP), and 1.6% sit at 32+ levels (80% good INP).
React & Next.js 9,570 sites 83% of React & Next.js sites have a DOM depth above 20 levels (40.1% at 32+ levels).
Across React sites, 42.5% have a maximum DOM depth of 21 to 31 levels (93% good INP) and 40.1% have 32+ levels (95% good INP).
Wix 5,825 sites 62.1% of Wix sites have 32+ DOM levels (96% good INP).
Across Wix sites, 62.1% have a maximum DOM depth of 32+ levels (96% good INP) and 37.2% have 21 to 31 levels (96% good INP).
By Arjen Karel · 210,902 crawled sites (126,761 with phone Chrome field data, 201,622 sites with maximum DOM depth, October 2026). How we measured.