search

moribvndvs / ng2-idle

Responding to idle users in Angular (not AngularJS) applications.
https://moribvndvs.github.io/ng2-idle
Apache License 2.0
315 stars 128 forks source link

Slows application down and forces change detection on every mouse move #86

Closed rsheptolut closed 6 years ago

rsheptolut commented 6 years ago

I'm submitting a ... (check one with "x")

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/HackedByChinese/ng2-idle/blob/master/CONTRIBUTING.md#getting-help

Current behavior

After adding and bootstrapping the package, the whole app substantially slows down.

Expected behavior Should be no slowdown.

Minimal reproduction of the problem with instructions

  1. Add the module: NgIdleModule.forRoot() from @ng-idle/core@2.0.0-beta.13
  2. Have this code in our app.component: 
    this.idle.setIdle(20000);
this.idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
this.idle.onIdleStart.subscribe(() => alert("blah!"));
this.idle.watch();
  3. Watch your whole app get slower. In some places just slightly, and in others, that are more heavy with data, - gives you a noticable lag on every mouse move, because Angular runs change detection after each mouse move now. I've noticed it in my change detection logs: a lot of change detection events, which sum up to 16-40ms on every mouse move. All of my controllers don't use the OnPush change detection strategy, that's just how I roll.

Note: One way to instrument change detection is to subscribe to ngDoCheck and ngAfterViewChecked on that same app.component and observe the time difference. Also good to have a property used in the template that takes some time to compute. But even the simplest pages still get these unnecessary change detection events.

What is the motivation / use case for changing the behavior? Should not slow down by default, and unless I'm just too dumb to get it, affects all apps. Can probably be worked around by using the OnPush change detection strategy, but it's a pain, and the simple workaround that did the job for me (and I think you should just build it in) is running the above reproduction code in NgZone.runOutsideAngular()

Please tell us about your environment: Windows, VS Code, npm, Angular CLI ng serve

moribvndvs commented 6 years ago

Should be closed by #74