Taking time to import shared module into lazy loaded modules in angular

Question

I have one app module and six lazy loaded feature modules in angular application.I am using primeng library.I need approximately 25 primeng modules in app module and all six lazy loaded modules.

I kept all 25 primeng modules in one shared module and imported the shared module in app module and remaining sixlazy loaded modules.It is taking a lot of time while loading initial page and lazy loading modules as it has to fetch all the modules in shared module every time we lazyload a module.

What is the best way to import all 25 primeng modules into all modules?

Answer 1

There is no other way around. The only difference is that the lazy loading modules get their own injection root. The shared module isn't merged with the injection root point, so your root AppModule gets merged with it and every lazy loading injection point's module gets merged with it, only global providers stay root when they only injected in the root AppModule.

So SharedModule's helps only to cleanup the imports for your modules not more and nothing less.

Maybe this gives you some ideas on how you could improve your app:

• Your Angular Module is a SCAM!
• Avoiding common confusions with modules in Angular

Edit:

Some things you can do directly:

• Setup a small landing page directly in your AppModule as index page without lazy loading so that your users gets a very fast response from the app
• Activate preloading strategy
• You can provide your own preloading strategy so that only the most important Modules gets preloaded