Angular Material Usage

[Zaky7]

Hi, I have recently came across this article where author say we should not use shared material module.

In this repo, we have a sharedModule consisting of material modules in it. Other feature modules are using the shared module in them. Do this have effect on the build size.

What is the correct pattern of using Angular Material. In the sharedModule or directly importing the required module in the respective feature module.

[tomastrajan]

Hi @Zaky7!

Using of SharedModule represents a tradeoff between most optimized bundle size and developer experience (convenience).

It is true that we would get smallest possible bundles by listing every single used module in every lazy feature module. On the other hand maintaining these lists is pretty tedious and error prone ( its easy to forget to remove import of module when the component is no longer used in the lazy feature) and also when testing, importing everything one by one in test bed is EXTRA tedious.

Hope this answers your question. Both approaches can work, it's up to you what you chose to optimize and what is your main requirement.

[Zaky7]

I agree @tomastrajan even in my own finding I found out the same. Using only required modules in the feature module would eventually reduce my bundle size but there would be trade off.

I have used same technique of using a shared module in my unit tests. Importing shared modules in tests is making them slow. I will try to removing less used Material modules from the shared module and check the results.

I think we can closed this issue

[tomastrajan]

@Zaky7 all the best with your projects, cheers !