Search code examples
javascriptangulartimeoutgoogle-chrome-devtoolsangular2-changedetection

NgZone timeout warnings in Chrome DevTools despite timeouts running outside the zone


Is it normal that you still get the warning in Chrome DevTools

[Violation] 'setTimeout' handler took 103ms zone.js:1894

even when you run all your timeouts outside ngzone? I do it this way:

this.zone.runOutsideAngular(() => {
    this._timeout = setTimeout(() => {
    // ...
    });
});

and clear existing timeouts onDestroy (Angular)


Solution

  • The fact that setTimeout runs outside Angular doesn't mean that it runs outside a zone.

    As the reference states,

    Executes the fn function synchronously in Angular's parent zone and returns value returned by the function.

    Running functions via runOutsideAngular allows you to escape Angular's zone and do work that doesn't trigger Angular change-detection or is subject to Angular's error handling.

    So it is expected that setTimeout still runs within a zone.