URL: https://github.com/facebook/create-react-app/issues/3518#issue-277616195

webpack-bundle-analyzer is an awesome little program for understanding why and which parts of your bundled .js files are so big. It's a lot more advanced (and pretty) than source-map-explorer.

Thanks to this tip by @trevorwhealy you can now use webpack-bundle-analyzer on a create-react-app bundle. Yay!

Check out the report I made for the client side code of Songsear.ch:

Webpack bundle analyzed for Songsear.ch

One thing I personally noticed from this is that the .png do take up quite a lot of kilobytes. And I'm quite that the whatwg-fetch polyfill uses 12KB before gzip.

Comments

Your email will never ever be published.

Previous:
Always return namespaces in Django REST Framework May 11, 2018 Python, Django
Next:
Rust > Go > Python ...to parse millions of dates in CSV files May 15, 2018 Python
Related by category:
Switching from Next.js to Vite + wouter July 28, 2023 JavaScript, React
How to SSG a Vite SPA April 26, 2025 JavaScript, React
An ideal pattern to combine React Router with TanStack Query November 18, 2024 JavaScript, React
swr compared to @tanstack/react-query August 30, 2024 JavaScript
Related by keyword:
Even more aggressively trying to preload your next page load January 22, 2018 Web development, JavaScript
Lazy loading below the fold October 26, 2013 Web development, JavaScript
How to create-react-app with Docker November 17, 2017 Linux, Web development, Docker, React, JavaScript
Inline scripts in create-react-app 2.0 and CSP hashes October 5, 2018 Web development, React, JavaScript