Skip to main content
Detects excessive DOM complexity that impacts performance
Rule IDperf/dom-size
CategoryPerformance
ScopePer-page
Severitywarning
Weight6/10

​
Solution

Large DOMs slow page rendering, increase memory usage, and harm mobile performance. Google recommends keeping total nodes under 1500. Fixes for large DOMs:
  • Use virtualization for long lists (e.g., react-window)
  • Lazy-load off-screen content
  • Reduce unnecessary wrapper elements
  • Use CSS instead of DOM for visual effects
  • Paginate large content sections

​
Options

This rule supports the following configuration options:
OptionTypeDefaultDescription
warn_thresholdunknownundefinedWarning threshold for total nodes
error_thresholdunknownundefinedError threshold for total nodes
max_depthunknownundefinedMaximum DOM depth
max_childrenunknownundefinedMaximum children per element

​
Configuration Example

squirrel.toml
[rules."perf/dom-size"]
warn_threshold = undefined
error_threshold = undefined
max_depth = undefined
max_children = undefined

​
Enable / Disable

​
Disable this rule

squirrel.toml
[rules]
disable = ["perf/dom-size"]

​
Disable all Performance rules

squirrel.toml
[rules]
disable = ["perf/*"]

​
Enable only this rule

squirrel.toml
[rules]
enable = ["perf/dom-size"]
disable = ["*"]