Read more

Google Chrome now has a JavaScript bundle visualizer

Dominik Schöler
November 02, 2021Software engineer at makandra GmbH

Similar to the Webpack Bundle Analyzer, Chrome's new Lighthouse feature …

… shows a visualisation of your JavaScript bundles. It's compatible with sourcemaps and is great for understanding large JavaScript modules used by your page. It can also visualise unused bytes.

Illustration UI/UX Design

UI/UX Design by makandra brand

We make sure that your target audience has the best possible experience with your digital product. You get:

  • Design tailored to your audience
  • Proven processes customized to your needs
  • An expert team of experienced designers
Read more Show archive.org snapshot

This is very helpful to visualize Javascript files in development. It also works on production code, where its usefulness depends on the structure of the productive Javascript code.

Warning

This will only work when your bundler emits source maps, which it may not do in production.
Also you should bundle in production mode so tree shaking Show archive.org snapshot is applied. Without tree shaking modules may appear larger than they end up.

Posted by Dominik Schöler to makandra dev (2021-11-02 14:34)