Full-Stack React Projects - Second Edition

Optimizing the bundle size

As you develop and grow a MERN application, chances are the size of the bundles produced with webpack will also grow, especially if large third-party libraries are used. Larger bundle sizes will affect performance and increase the initial load time of the application. We can make changes in the code to ensure we don't end up with large bundles and also utilize features packed in webpack to help optimize bundling.

Before going into the code to update it for bundle size optimization, you can also get familiar with the default optimization options that are part of webpack. In the MERN applications, we used the mode config to utilize the default settings for both development and production mode. To view an overview ...