Once you start splitting code, it can be useful to analyze the output and check where modules have ended up. It's important to get the most out of bundling, so a formal procedure for bundle analysis can be considered as fundamental, as well as browser and security testing. The official analyze tool is recommended. There are also some other options:
- webpack-bundle-analyzer: This is a plugin and CLI utility that represents bundle content as a convenient interactive treemap, where zooming options are available.
- webpack-bundle-optimize-helper: This tool will analyze your bundle and give suggestions to reduce your bundle size.
- webpack-visualizer: This is used to visually analyze bundles to see which modules are taking up too much space and which might be duplicated.
- webpack-chart: This offers an interactive pie chart used for Webpack stats.
Treemapping is a method used to display hierarchical data using nested figures, usually rectangles.
All the previously mentioned tools will help with optimization, which is the primary purpose of Webpack.