Zone pollution in Angular is unnecessary change detection triggered by asynchronous work—such as a timer or third-party event handler—that does not change data shown in the view. Profile first, then move only the non-UI work outside Angular’s zone; re-enter when a callback updates application state. This advice is aimed at zone-based applications: Angular’s performance guide says zoneless change detection is the default for new applications in Angular v21 and later.
What zone pollution means
Angular describes Zone.js as “a signaling mechanism that Angular uses to detect when an application state might have changed.” Zone.js tracks asynchronous activity, including timers, network requests, and event listeners. In a zone-based application, that activity can prompt change detection even when the task did not change the model or anything a template displays. That unnecessary work is called zone pollution.
As an Amazon Associate I earn from qualifying purchases.
The issue is not that every timer or asynchronous operation is harmful. It is that frequent work can repeatedly ask Angular to check the application when no view update is needed. Angular’s explanation is in its zone pollution guide.
Find the source before changing code
Use Angular DevTools’ profiler to inspect change-detection activity. Repeated cycles associated with setTimeout, setInterval, requestAnimationFrame, or event handlers are clues, not proof that a particular task is wasteful. Trace the activity to the code or library that scheduled it, then determine whether it changes template-visible state.
#1 Best Overall
Angular notes that when an application has only a limited number of its own calls to these APIs, a third-party library is often the cause. Libraries may install listeners, start timers, or make XHR requests when initialized inside Angular’s zone. Profile to identify bottlenecks rather than moving code preemptively; see Angular’s performance overview for its profiling guidance.
Keep non-UI work outside Angular’s zone
For a timer or initialization routine whose asynchronous work does not need to update Angular views, use NgZone.runOutsideAngular():
this.ngZone.runOutsideAngular(() => {
setInterval(pollForUpdates, 500);
});Tasks and microtasks scheduled from inside the callback continue outside Angular’s zone, so they do not trigger change detection through the zone mechanism. The interval above is an illustrative example, not a recommended polling frequency. Angular’s NgZone API documents this behavior.
Quick wins for a faster PC:
Repair Windows errors before they cause bigger problemsFix Now →Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Third-party libraries and frequent handlers
Initialize a library outside the zone when its frequent timers, event handlers, or other asynchronous tasks do not need to update the Angular view. Angular’s zone pollution guide demonstrates this pattern with Plotly; handlers registered during that initialization also run outside the zone.
Rank #3
Re-enter when the view needs an update
If an outside-zone handler changes application state or emits an Angular output, wrap that meaningful update in NgZone.run():
plotly.on('plotly_click', event => {
this.ngZone.run(() => {
this.plotlyClick.emit(event);
});
});The goal is not to keep all code outside Angular. Keep high-frequency work there when it has no UI effect, and notify Angular when state changes need to render. Depending on the application’s architecture, an explicit change-detection mechanism may also be appropriate.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Check whether your application is zoneless
The right remedy depends on the application’s Angular version and configuration. Angular’s performance overview says zoneless change detection is the default for new applications in Angular v21 and later; its zone-pollution guidance is for zone-based applications. Establish which mode the application uses before applying a zone-specific fix.
PC Slower Than It Used to Be?
A free scan shows the junk files, broken settings and background clutter dragging Windows down - then fixes them in one click.Free scan · Windows 10 & 11Outdated Drivers Are Slowing You Down
One free scan finds every outdated or missing driver and matches the right update for your exact hardware.Free scan · exact hardware match| Approach | What it addresses | What to consider |
|---|---|---|
| Stay zone-based and target unnecessary tasks | Profiled timers, handlers, or library work that triggers needless change detection | Keep unrelated work outside the zone, but re-enter or otherwise notify Angular when state changes should render. |
| Adopt zoneless change detection | Applications configured to use Angular’s zoneless notification mechanisms rather than Zone.js-driven detection | Check version-specific migration, third-party library, SSR, and testing compatibility in Angular’s guide; there is no universal performance benchmark establishing this as the right choice for every application. |
For Angular v20, the zoneless guide documents opting in at bootstrap with provideZonelessChangeDetection(). It lists notifications Angular relies on in zoneless mode, including ChangeDetectorRef.markForCheck, ComponentRef.setInput, updating a signal read by a template, and bound host or template listeners. Angular recommends OnPush as one way to help ensure compatible notification behavior, but says it is not required.
When a team is ready to migrate, Angular’s guide says to remove Zone.js from build polyfills and dependencies. It also says NgZone.run() and runOutsideAngular() can remain in code compatible with zoneless applications. Removing those calls indiscriminately can cause regressions in libraries used by applications that still rely on Zone.js. Consult the version-specific Angular zoneless guide before changing a production application.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
