Should we use NgZone.runOutsideAngular() when handling fromEvent with filters in Angular

Question

I came across this implementation of the outsideCLick directive

ngOnInit() {
    this._ngZone.runOutsideAngular(() => {
      fromEvent<MouseEvent>(document, DomEventsEnum.MOUSEDOWN, { capture: true })
        .pipe(
          filter(() => this.clickOutsideEnabled),
          filter((event) => !this.isClickInside(event.target as HTMLElement)),
          takeUntilDestroyed(this._destroyRef),
        )
        .subscribe((event) => {
          event.preventDefault();
          event.stopPropagation();
          this._ngZone.run(() => this.clickOutside.emit(event));
        });
    });
  }

I'm wondering if there is any actual benefit in wrapping this logic with ngZone.runOutsideAngular()?

Since CD is only triggered when clickOutside.emit() is called due to filters in any case - is runOutsideAngular actually doing anything useful here?

Matthieu Riegler · Accepted Answer · 2025-08-18 19:17:35Z

3

Yes, Because in zonefull apps, fromEvent internally invokes addEventListener which will schedule CD everytime an event is emitted.

With the implementation you gave us, it'll only schedule CD when calling the emit.

answered Aug 18 at 19:17

Matthieu Riegler

59.8k27 gold badges158 silver badges208 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Should we use NgZone.runOutsideAngular() when handling fromEvent with filters in Angular

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related