Angular Lazy Loading Feature Module Routes

Question

I have a confusion regarding lazy loading a feature module. I do understand the concept of lazy loading a feature module but my question is shall i lazy load every route inside the feature module?

For Example i have a feature called 'Announcement'. It has a list, create, edit and details component. What i did is that i lazy loaded every route inside the feature module along with the feature module itself.

Day by day my application getting bigger so it takes a while to serve or build the application since it goes through each and every module.

So should i lazy loaded every route inside the feature module?

Recently i faced a issue 'JavaScript Heap out of Memory' while building the application. So i did google the issue and most of them suggested to increase the node size. When i tried to find why is this happening some suggested it could happen because of excessive modules. If i don't want to increase the node size then i need to optimize the modules of my application. — Johanur Rahman
– Johanur Rahman, Commented Apr 1, 2020 at 6:57
Thank you Manish for the reference... I am reading this right now. — Johanur Rahman
– Johanur Rahman, Commented Apr 1, 2020 at 6:58

Anoop Rajasekhara Warrier · Accepted Answer · 2020-04-01 07:03:22Z

To answer to your question, The lazy loading is to enhance the performance of the application. So our application will be split into multiple functional modules and implement lazy loading. By doing so, based the navigation to particular route, it will load only that particular things which is required. (It will create a chunk.js) and if we re route to this again, it will not reload every thing again as its already loaded. You can see a demo in below url:

https://angular-auxillary-route-lazy-load-example.stackblitz.io

For more detailed info refer below links:

https://angular.io/guide/lazy-loading-ngmodules

https://medium.com/@thiago.reis/how-to-implement-lazy-loading-in-angular-c8dcbf165561

We don't need to create modules for each component, we need to do this only for a functional modules. Example: LoginModule (that handles all the login functionalities), UserModule (which tracks user information)...

Hope this helps.

Collectives™ on Stack Overflow

Angular Lazy Loading Feature Module Routes

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related