NgZone

Controls whether code runs inside Angular's change detection zone.

Since Angular 2+ Spec ↗

Syntax

ngZone.run(fn) | ngZone.runOutsideAngular(fn)

Parameters

NameTypeRequiredDescription
fn function No Work to run inside or outside the Angular zone.

Returns

any — The return value of the supplied function.

Examples

import { Component, NgZone, inject } from '@angular/core';

@Component({ selector: 'app-x', standalone: true, template: '' })
export class XComponent {
  private zone = inject(NgZone);
  start() {
    this.zone.runOutsideAngular(() => {
      requestAnimationFrame(function loop() {
        requestAnimationFrame(loop);
      });
    });
  }
}

Notes

Use runOutsideAngular for high-frequency work (animations, scroll) to avoid triggering change detection on every tick, then ngZone.run to re-enter when updating state. With zoneless change detection (provideZonelessChangeDetection) this is rarely needed; rely on signals instead.