platosha
Event Listeners should be registered outside Angular
In an Angular 2 app, zone.js basically polyfills/overrides native functions like addEventListener, setTimeout etc.
When event listeners are added using addEventListener function, they get registered in the zone.js and effectively are used to detect changes inside the app.
In practice, components like vaadin-grid and vaadin-combo-box listen to scroll event, therefore scrolling these components will trigger the execution of ngDoCheck function on every directive/component in the app on every event.
This will most likely cause performance issues like we already saw earlier when hovering over vaadin-charts.
To fix this, we should be able to somehow register our event listeners outside Angular using
this.zone.runOutsideAngular(() => {
// call addEventListeners here.
});
I noticed the same issue and was thinking about how to use runOutsideAngular to wrap all Polymer events to improve performance. I am seeing quite a bit of performance degradation with nested elements - not just Vaadin elements, but basic paper-elements like paper-menu-button. Anybody looking at this. Any workarounds?
