A brief discussion about Lazy Loading in Angular.

Today, In this blog, we are going to discuss the Lazy Loading in Angular. We will see what is lazy loading with example.A brief discussion about Lazy Loading in Angular.

How to use Mouse enter and Mouse leave events in Jqueryexpoundsofttechsolution A brief discussion about Lazy Loading in Angular.

Lazy loading is one of the most powerful and useful concepts of Angular Routing. It is a technology of angular that allows you to load JavaScript components when a specific route is activated. It makes the web pages easy to download by downloading them in chunks instead of downloading everything in a big bundle.

It improves application load time speed by splitting the application into many bundles. When the user navigates by the app, bundles are loaded as needed.
Lazy loading facilitates asynchronously loading the feature module for routing whenever required using the property loadChildren.

Below is the example of lazy loading, where both Customer and Order features loading lazily.

Example :

const routes: Routes = [
{
path: ‘customers’,
loadChildren: () => import(‘./customers/customers.module’).then(

module => module.CustomersModule)
},
{
path: ‘orders’,
loadChildren: () => import(‘./orders/orders.module’).then(module => module.OrdersModule)
},
{
path: ”,
redirectTo: ”,
pathMatch: ‘full’
}
];

So, thanks for following this blog, and if you need any help please leave your queries in the comment box we will be happy to help you.