Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Production bundle bigger than dev bundle

See original GitHub issue

Hi,

This may be a dumb question, but I just noticed that my production bundle is heavier than the development one, does that make sense? When I use npm start, my bundle.js is 382KB, while when I run npm run build, I get a 600KB main.xxx.js.

I would have thought that the production version would be lighter, but maybe optimizations come with the price of a bigger version?

Thank you by advance!

Issue Analytics

State:
Created 7 years ago
Comments:10 (5 by maintainers)

Top GitHub Comments

3reactions

gaearoncommented, Mar 4, 2017

Are you aware that code like this:

  addLocaleData(require(`react-intl/locale-data/${state.lang}`));

will pull all the locales into your bundle because Webpack can’t guess which one it would be?

(This still should affect both dev and prod size, but just to double check.)

0reactions

fijiwebdesigncommented, Jan 10, 2019

In my case the dev bundle was gzipped while the prod wasn’t making it appear larger.

Top Results From Across the Web

Why ReactJS bundle size in development mode is smaller ...

The configuration seems to work pretty well, but the bundle size in development mode is smaller than production mode.

5 Methods to Reduce JavaScript Bundle Size - Bits and Pieces

Using Production Mode in Webpack. Running your project in production mode reduces the bundle sizes compared to the development mode. Webpack ...

How CommonJS is making your bundles larger - web.dev

In this post, we'll look into what CommonJS is and why it's making your JavaScript bundles larger than necessary.

3 ways to reduce webpack bundle size - Jakob Lind

With webpack, you can split your bundle into many smaller bundles, and then the browser can automatically fetch the bundles needed asynchronously. This...

Slimming down your bundle size - LogRocket Blog

They can also be external dependencies and libraries you use to build your application like React, lodash, or jQuery. So in order for...