Ionic 2 视图更新变慢

Question

我正在使用 Ionic 2 构建一个包含计时器的应用程序。当计时器启动时，一切都很好，并且更新是即时的。然而，在 Ionic View 中，视图更新变得越来越慢。超时设置为 32 毫秒，但在计时器运行 3 分钟后，更新大约是秒。我还通过运行将其作为 Android 应用程序进行了测试。更新也变得越来越慢，但没有 Ionic View 慢。奇怪的是，当我触摸屏幕时，更新又是即时的，直到我释放它。

我该如何解决这个问题？

我使用

启动计时器

this.timer = setInterval(self.getUpdate(self), 32);

getUpdate 函数

getUpdate(self) {
    return () => {
        self.lapTime = TimerPage.formatTime(new Date().getTime() - self.startTime);
        self.cd.markForCheck();
    };
}

在视图中我只是用它来显示时间

<div>{{lapTime}}</div>

Answer 1

因为目前还不清楚是什么导致了这个问题，并且在 5 小时内没有人提出任何建议。

可能的原因：

Angular 对 change detection

使用 zone.js

跟踪所有 Asynchronous 事件并提供挂钩

和 Angular 使用这些挂钩 Re-render 视图。

如果每隔 32ms

触发一次，可能会有点重

`Solution:`

~~在 Angular 的 Github 帐户~~

上提交问题

运行你的 setInterval 超出了 zone.js 的范围

import {Component, NgZone} from 'angular2/core';

@Component({})
export class YourClass{
  constructor(public zone:NgZone){}

  setSetInterval(self){ //just a random, normal function

    this.zone.runOutsideAngular(
      //anything done here won't trigger a change detection

      this.timer = setInterval(self.getUpdate(self), 32); 
    )
  }

  getUpdate(self){
    this.zone.run(
      //to reenter the angular's parent zone and trigger a change detection

      //put your functions functionality in here
    )
  }

}

Ionic 2 视图更新变慢

Ionic 2 view updates become slow

ionic2

angular

`Solution:`