Angular14 min read
Preloading Lazy Routes (Better Perceived Performance)
Preload lazy-loaded routes after initial load so navigation feels instant later.
Noah Adams
September 14, 2025
5.2k124
Lazy loading makes initial load faster, but the first visit to a lazy route can feel slower. Preloading solves that by loading feature bundles in the background after the app starts.
## The idea
- App loads fast
- After the user lands, Angular quietly preloads feature routes
- Later navigation feels instant
## Enable preloading
```ts
import { provideRouter, withPreloading, PreloadAllModules } from '@angular/router';
bootstrapApplication(AppComponent, {
providers: [
provideRouter(routes, withPreloading(PreloadAllModules)),
],
});
```
## When to use
- dashboards with many pages
- apps where users likely visit most routes
- when network is decent and you want smoother UX
## When not to use
- very large features rarely visited
- strict bandwidth environments (some mobile cases)
> Next: FormArrays and dynamic forms like “add more addresses.”
#Angular#Routing#Performance#Advanced