perf(observe-content): run outside Angular zone (#6352)

* Runs the underlying `MutationObserver` outside the Angular zone.
* Runs the debounce timeout outside the Angular zone.

via https://github.com/angular/flex-layout/pull/370.
This commit is contained in:
Kristiyan Kostadinov
2017-08-09 23:59:50 +02:00
committed by mmalerba
parent 72c5d39fc3
commit 5ccf25d5dd
+14 -7
View File
@@ -16,6 +16,7 @@ import {
OnDestroy,
AfterContentInit,
Injectable,
NgZone,
} from '@angular/core';
import {Subject} from 'rxjs/Subject';
import {RxChain, debounceTime} from '@angular/cdk/rxjs';
@@ -52,19 +53,24 @@ export class ObserveContent implements AfterContentInit, OnDestroy {
constructor(
private _mutationObserverFactory: MdMutationObserverFactory,
private _elementRef: ElementRef) { }
private _elementRef: ElementRef,
private _ngZone: NgZone) { }
ngAfterContentInit() {
if (this.debounce > 0) {
RxChain.from(this._debouncer)
.call(debounceTime, this.debounce)
.subscribe((mutations: MutationRecord[]) => this.event.emit(mutations));
this._ngZone.runOutsideAngular(() => {
RxChain.from(this._debouncer)
.call(debounceTime, this.debounce)
.subscribe((mutations: MutationRecord[]) => this.event.emit(mutations));
});
} else {
this._debouncer.subscribe(mutations => this.event.emit(mutations));
}
this._observer = this._mutationObserverFactory.create((mutations: MutationRecord[]) => {
this._debouncer.next(mutations);
this._observer = this._ngZone.runOutsideAngular(() => {
return this._mutationObserverFactory.create((mutations: MutationRecord[]) => {
this._debouncer.next(mutations);
});
});
if (this._observer) {
@@ -79,8 +85,9 @@ export class ObserveContent implements AfterContentInit, OnDestroy {
ngOnDestroy() {
if (this._observer) {
this._observer.disconnect();
this._debouncer.complete();
}
this._debouncer.complete();
}
}