DOM Treemap

Helps you explore the distribution of DOM nodes in the document tree.

DOM Treemap - Visualize Devtools Elements Distribution

DOM Treemap is a Chrome extension designed to help developers discover and understand how DOM nodes are distributed throughout their document. This extension enhances Google Chrome's Devtools Elements tab by providing a visual representation of node descendants as you navigate through a DOM tree. It's particularly useful for discovering areas with an excessive number of nodes. It also includes a feature for BEM enthusiasts, providing a visual of how node-intensive different BEM components are on average.
Install from Chrome Web Store

Extension stats

Users: 1,000+
Rating: 5.00
(4)
Version: 1.1.1 (Last updated: 2021-06-30)
Creation date: 2021-06-24
Risk impact: Low risk impact
Risk likelihood:
Manifest version: 2
Size: 151.55K
URLs: Website

Other platforms

Not available on Android
DOM Treemap (v1.1.0)
5.00 (6) 121
Not available on Edge
Want to check extension ranking and stats more quickly for other Chrome extensions? Install Chrome-Stats extension to view Chrome-Stats data as you browse the Chrome Web Store.

Extension summary

After a Google Lighthouse audit complaining an excessive DOM size, have you ever wondered in which corner of your document most DOM nodes are buried? Neither Lighthouse nor the Devtools themselves help finding those areas.

That's what DOM Treemap is for. It extends your Devtools Elements tab with an additional pane which visualizes the distribution of node descendants of the currently inspected DOM element. This makes it easy for you drill down your DOM and to locate all those hidden the node heavy parts.

On top of that there is an extra tab for all those BEM affiniciados which visualizes via yet another treemap how node intensive your different BEM component are in average.

User reviews

by Philippe Boblet, 2024-12-10

Sehr gute Idee und gut umgesetzt. Unbedingt aktuell halten ;) LG Sebbo #wwsiv #workingdraft
by Sebastian M, 2021-11-22

Sehr nützlich!
by Sarah Groß, 2021-11-19
View all user reviews

Extension safety

Risk impact

DOM Treemap requires very minimum permissions.

Risk likelihood

DOM Treemap has earned a good reputation and can be trusted.

Upgrade to see risk analysis details

Similar extensions

Here are some Chrome extensions that are similar to DOM Treemap: