Which formats does it read?

Both webpack stats.json (modules[]) and esbuild metafile (inputs/outputs). Paste either one and it works out which it is.

Why a tree instead of a total?

When a bundle grows, the number you need is not the total but who ate it. A stats file is tens of thousands of lines, so it is folded into a folder tree drawn by area.

How does it find duplicates?

It gathers packages with the same name that came in from different paths (nested node_modules) and lists where each copy sits.

Bundle map

Name: 번들 지도
Author: KarmoLab

webpack, esbuild, heaviest paths, duplicate packages

번들 지도

webpack stats.json 이나 esbuild metafile 을 넣으면 어디가 무거운지 넓이로 보여 주고, 두 번 들어간 꾸러미를 찾아 줍니다

stats.json 이나 metafile (브라우저 밖으로 안 나갑니다)

또는 붙여넣기

무거운 곳

두 번 들어간 꾸러미

webpack stats.json 이나 esbuild metafile 을 넣으세요

Reads a webpack stats.json or an esbuild metafile and shows what is heavy, as a folder tree drawn by area. It also finds packages that got bundled twice.

How to use it

Paste a stats.json or a metafile. the format is detected for you
Read the area map largest tile first. tile area is size
Pick what to cut from the heaviest-path ranking
Check the duplicate-package list. the usual reason a bundle suddenly grows

Common questions

Which formats does it read?: Both webpack stats.json (modules[]) and esbuild metafile (inputs/outputs). Paste either one and it works out which it is.
Why a tree instead of a total?: When a bundle grows, the number you need is not the total but who ate it. A stats file is tens of thousands of lines, so it is folded into a folder tree drawn by area.
How does it find duplicates?: It gathers packages with the same name that came in from different paths (nested node_modules) and lists where each copy sits.

Other tools

Stays on your device What you enter is handled inside your browser only. nothing is stored or sent anywhere.

This tool page states where what you enter goes. see the badge above. All tools, KarmoLab, Who made this , Built with AI. View source