Angular 2 变化检测 - 刷新 DOM 即使没有任何变化

Question

我已经构建了一个应用程序，它是 LIVE 测试版，我现在正在尝试优化它的性能。我有一个案例，其中有一个带有图像的 table，我注意到图像一直在闪烁，这让我看到了引擎盖下，我注意到 DOM 一直在刷新。令人耳目一新，没有任何变化，但它每秒不断删除和重新添加自己几次。

我想，我会首先登录到 ngOnChanges(_:SimpleChanges) 函数，但是从那里没有任何东西进入 console.log，这意味着组件本身没有改变，但由于某种原因，它认为有必要刷新它 DOM.

我只是想知道，我如何调试它并知道是什么导致组件刷新它 DOM？

也许一些工具会有所帮助？我试过 Augury，但这似乎对调试性能问题没有帮助。

PS。在

中渲染组件

changeDetection: ChangeDetectionStrategy.OnPush

mode 有点帮助（仍然不明白，如果 OnChanges 从不运行，为什么它有帮助）......但它并没有完全消除 DOM 在随机时刻刷新。

编辑 1

DOM 在控制台刷新，看起来像这样

Answer 1

我找到了我自己问题的答案。我的问题是在我的模板中使用由 get 方法生成的数组。阿卡。有 2 个模型：[ParentModel, ChildModel]，ParentModel 包含一个 ChildModel 数组。现在我只想从 ParentModel 中选择那些 ChildModels 而我所做的是

class ParentModel {
    __specificChildren() : IChild[] {}
}

在模板中，我使用了

*ngFor="let child of parentModel.__specificChildren()"

这开始刷新不已。可能是因为一些全局事件触发了相关模型的变化检测，每次检查时都会创建一个具有不同指针的数组，这告诉 Angular 某些东西发生了变化，从而触发了变化检测。

无论如何，我是如何解决这个问题的，而不是在模板中使用函数，这是最佳的，因为我不想在组件中创建一个无用的变量来使事情复杂化，我仍然在中创建了辅助变量组件，从而导致：

组件

public specificChildren: IChild[]

parentDatatabe.subscribe( _parent {
    this.parent = _parent;
    this.specificChildren = _parent.__specificChildren()
})

模板

*ngFor="let child of specificChildren"

因此只有在父数据库推送新值时才设置新的子项。

Angular 2 变化检测 - 刷新 DOM 即使没有任何变化

Angular 2 change detection - refreshing DOM even though nothing has changed

performance

angular2-template

angular

angular5

angular6

编辑 1