DOM tree depth on Wix sites

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

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 97% of React sites have a good INP, against 97% 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%97%

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

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