Treemap for webpack statistics

[markov00]

No description provided.

[marcofugaro]

With treemap you mean the default webpack output?

[markov00]

Something like https://github.com/chrisbateman/webpack-visualizer but in ASCII on the console as a treemap https://en.wikipedia.org/wiki/Treemapping

[marcofugaro]

nice!

[markov00]

also check these references:

https://github.com/yaronn/blessed-contrib

https://twitter.com/rick_scavetta/status/776088603873120256

https://www.npmjs.com/package/ascii-chart

[lucafalasco]

as a starting point, this is pretty cool: https://github.com/FormidableLabs/webpack-dashboard

[caesarsol]

A couple other links:

• https://www.npmjs.com/package/cli-table
• https://www.npmjs.com/package/bar-horizontal

The idea is to give a hint of what is in your bundle by size, and/or what is slowing down your compile time in development, something like that

[marcofugaro]

also to keep in mind: file size is useless in development because of sourcemaps and tree-shaking, it's more useful in the build task

[marcofugaro]

Another useful link
https://github.com/clessg/progress-bar-webpack-plugin

[marcofugaro]

Another ref by ces
https://reactjs.org/blog/2017/12/15/improving-the-repository-infrastructure.html#tracking-bundle-size

or

https://github.com/siddharthkp/cost-of-modules

or

https://github.com/stephencookdev/speed-measure-webpack-plugin

or

ZEPELIN (ask cesare)

or

https://github.com/klauscfhq/signale

or, how they do it in CRA

facebook/create-react-app#3945

or our best

https://github.com/chunqiuyiyu/ervy/

or

https://github.com/danvk/source-map-explorer

or

https://github.com/btd/rollup-plugin-visualizer