Avoid an excessive DOM size
What is the avoid excessive-DOM size warning in lighthouse, PageInsights etc? Lighthouse flags pages that have either:
- more than 1,500 DOM nodes in total.
This means that there are more then 1500 html elements on our page. - a maximum node-depth greater than 32 nodes.
This happens when an element is nested in at least 32 parent elements. - a parent node with more than 60 child nodes.
The can happen when a parent element (like a table of a list) has more then 60 childs (table rows, or list elements)
An excessive DOM size will most likely indirectly affect important lighthouse metrics like largest contentful paint (LCP) and cumulative layout shift (CLS).
How to avoid an excessive DOM size
With Staq Cache you can easily avoid an excessive DOM size!
Go to Site Optimizer > Extra Options, and enable Optimize HTML in order to reduce your DOM size:
You might be interested in these
