What is lazy loading in Angular?

Lazy loading defers loading of Angular feature modules until the user navigates to a route that requires them, reducing the initial bundle size and improving startup performance. Without lazy loading: all code for every feature is bundled together and loaded upfront, even if the user never visits those features. With lazy loading: only the AppModule and eagerly-loaded features are loaded initially; other modules are loaded on-demand. Setting up lazy loading: create a feature module with its own routing: const routes: Routes = [ { path: "admin", loadChildren: () => import("./admin/admin.module").then(m => m.AdminModule) }, { path: "shop", loadComponent: () => import("./shop/shop.component").then(m => m.ShopComponent) // standalone component lazy loading } ];. Preloading strategies: RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules }) — preloads all lazy modules in the background after initial load (best of both worlds: fast initial load + instant navigation). Custom preloading: selectively preload modules based on data attributes. Code splitting: Angular CLI automatically creates separate JavaScript chunks for each lazy-loaded module. Verify in network tab: the admin.module.js file loads only when navigating to /admin. Standalone component lazy loading: Angular 14+ supports lazy loading individual standalone components without modules: loadComponent: () => import("./feature.component").then(m => m.FeatureComponent).