DOM tree depth on Wix sites

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

32+ DOM levels is the most used: 62.3% of Wix sites. 21 to 31 DOM levels is 37.0% of Wix sites.

On React, 62% of sites use 32+ DOM levels maximum DOM depth, and 100% of React sites have a good INP, against 100% 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%100%

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

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, 100% of sites with 21 to 31 DOM levels maximum DOM depth have a good INP, against 100% of React sites with 32+ DOM levels. Within React, sites with 21 to 31 DOM levels and 32+ 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 (31ms median). Another 37.0% (2,079) nest 21 to 31 levels deep (100% good INP, 35ms median), while the 62.3% (3,504) exceeding 32 levels drop to 100% good INP (39ms median).