Co to jest DOM Treemap?

DOM Treemap to rozszerzenie Chrome opracowane przez https://schepp.dev, a jego główną funkcją jest „Helps you explore the distribution of DOM nodes in the document tree.”.

Zrzuty ekranu rozszerzenia

Pobierz plik CRX rozszerzenia DOM Treemap

Pobierz pliki rozszerzeń DOM Treemap w formacie crx, zainstaluj ręcznie rozszerzenia Chrome w przeglądarce lub udostępnij pliki crx znajomym, aby łatwo zainstalować rozszerzenia Chrome.

Instrukcja Użytkowania Rozszerzenia

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.

Podstawowe informacje o rozszerzeniu

Nazwa	DOM Treemap
ID	albnoggfgnooeefdjpncieecohhblonh
Oficjalny URL	https://chromewebstore.google.com/detail/dom-treemap/albnoggfgnooeefdjpncieecohhblonh
Opis	Helps you explore the distribution of DOM nodes in the document tree.
Rozmiar pliku	148 KB
Liczba instalacji	1,673
Aktualna Wersja	1.1.1
Ostatnia Aktualizacja	2021-06-30
Data Publikacji	2021-06-24
Ocena	5.00/5 Łącznie 3 Oceny
Deweloper	https://schepp.dev
E-mail	[email protected]
Typ Płatności	free
Obsługiwane Języki	en
manifest.json
{ "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx", "manifest_version": 2, "icons": { "16": "icon16.png", "48": "icon48.png", "128": "icon128.png" }, "name": "DOM Treemap", "version": "1.1.1", "description": "Helps you explore the distribution of DOM nodes in the document tree.", "devtools_page": "devtools.html", "permissions": [] }