DOM tree depth on Wix sites

Sites with 32+ DOM levels maximum DOM depth have a good INP most often: 96%, against 96% of all Wix sites. Sites with 21 to 31 DOM levels DOM depth have it least often, at 96%.

32+ DOM levels is the most used: 62.3% of Wix sites.

React sets the maximum DOM depth to 32+ DOM levels on 62% of its sites, and 96% of React sites have a good INP, against 96% of all sites.

FrameworkMaximum DOM depth on its sitesGood INP

All Wix sites 5,621 sites32+ levels deep 62%21 to 31 levels deep 37%96%

React 5,620 sites32+ levels deep 62%21 to 31 levels deep 37%96%

32+ levels deep 21 to 31 levels deep 15 to 20 levels deep Under 15 levels deep

Does the framework explain the maximum DOM depth difference?

On React, 96% of sites with 32+ DOM levels maximum DOM depth have a good INP, against 96% of React sites with 21 to 31 DOM levels. Within React, sites with 32+ DOM levels and 21 to 31 DOM levels have a good INP about equally often.

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 34 sites (0.6%) at 15 to 20 levels, 100% achieve good INP (95ms median). Another 37.0% (2,079) nest 21 to 31 levels deep (96% good INP, 75ms median), while the 62.3% (3,504) exceeding 32 levels drop to 96% good INP (80ms median).