Search code examples
reactjscreate-react-appreact-bootstrap

React bootstrap - no change in bundle size when importing components directly


Following the https://react-bootstrap.github.io/getting-started/introduction#importing-components I've changed all imports in my project from import * as rb from 'react-bootstrap' to import <component> from 'react-bootstrap/<component'. I was expecting this would lead to a smaller bundle size, but after analysing via source-map-explorer the bundle size is pretty much the same (it even grew by unnoticeable amount). The project was created by create-react-app, react v17.0.2 and react-bootstrap v2.2.2.


Solution

  • Create React App supports tree shaking, which is automatically configured. Tree shaking removes unused code from the packages: https://en.wikipedia.org/wiki/Tree_shaking.

    This results in the same size, because in the end there is no difference between using only some components or using the whole package and stripping unused parts of it.