CODEWITHSUNDEEP
angularionic-frameworkimportangular-materialsize
Chrissi Grilus
Chrissi Grilus

Reputation: 1395

Effects of amount of imports on overall Angular production bundle size

I was looking for an answer but couldnt find one on my very basic question. I am building a Angular App and at some point wanted to exchange the angular material components to the ionic web components. In one feature of my app I am depending on the material data table which ionic does not offer a substitute.

To my question: How does it effect my final bundle size if I include angular material to my dependencies just for this table? Does Angular only use the modules I import in production and tree-shake the rest of the angular material package? I would be very thankful for some information on bundlesizes and imports. Its more of a general question if its "worth" to use a big package just for one component and how the imports work with that.

Upvotes: 2

Views: 192

Answers (1)

Sergey Rudenko
Sergey Rudenko

Reputation: 9235

Modern Angular should "tree shake" all unused components when you build the app for production (ionic build --prod if you are using Ionic).

There were issues with the tree shaking in the past when a different approach to packaging was used. You can read more details in this closed issue thread here: https://github.com/angular/components/issues/4137

If you feel like it's not working in your case - try using a different count of components in your app and monitor build package sizes and then you can ask specific questions with all the context.

Upvotes: 2

Related Questions