Performance Angular2 OnPush更改检测和ngFor

Performance Angular2 OnPush更改检测和ngFor,performance,angular,angular2-changedetection,Performance,Angular,Angular2 Changedetection,我有一个父组件,它使用ngFor显示子组件列表。我注意到,随着孩子数量的增加,性能变得非常糟糕,因此我将两者都改为OnPushchange-detection策略 这帮了大忙,但是当它变慢时,仍然有一些场景,我可以看到这是由于对每个孩子执行了不必要的更改检测 一个例子是,当子组件内部有一个单击事件时,即使没有任何输入被更改,并且只是触发了一个动画,出于某种原因,正在对父组件执行更改检测,并因此对每个子组件执行更改检测(即使ngFor背后的模型根本没有改变,而且它是一种OnPush策略…)。我本以

我有一个父组件,它使用
ngFor
显示子组件列表。我注意到,随着孩子数量的增加,性能变得非常糟糕,因此我将两者都改为
OnPush
change-detection策略

这帮了大忙,但是当它变慢时,仍然有一些场景,我可以看到这是由于对每个孩子执行了不必要的更改检测

一个例子是,当子组件内部有一个单击事件时,即使没有任何输入被更改,并且只是触发了一个动画,出于某种原因,正在对父组件执行更改检测,并因此对每个子组件执行更改检测(即使
ngFor
背后的模型根本没有改变,而且它是一种
OnPush
策略…)。我本以为这种“孤立”事件只会触发特定子组件中的更改检测,而不会向上传播(我实际上尝试了
event.stopPropagation()
事件.preventDefault()
未成功)

所以我想知道两件事:

1) 有没有办法对实际运行的事件更改检测以及是否触发父组件更改检测进行更多控制

2) 在每个子组件(来自ng2translate)中大量使用“translate”管道是否会大大降低应用程序/更改检测的速度

下面的示例plunkr显示了问题所在。基本上,如果我点击ngFor列表中的任何一个项目,它会对每个孩子而不仅仅是受影响的孩子进行变化检测,我想知道是否有办法抑制这种变化

1)您可以使用
ChangeDetectorRef.detach()

将变更检测器从变更检测器树中分离

在重新连接之前,不会检查分离的变化检测器

这也可以与ChangeDetectorRef结合使用,以实现本地更改检测检查


2) 管道(如果是纯管道,这是默认值)仅在管道值或参数更改时调用,因此没有性能缺点。

谢谢。我已经用plunkr更新了我的问题,以便更好地演示问题。但基本上没有办法“抑制”兄弟更改检测,我需要完全分离更改检测,并自己处理它?@Zyga我认为您的子组件中没有更改检测。将console.log放入
isVisible
方法中。它将仅为您单击的项目调用
ngDoCheck
正在为所有子项运行。如果您删除
OnPush
,则您的所有孩子都将checked@Zyga角度标记
OnPush
组件在第一个变更检测周期后检查,然后在@Zyga处将其忽略。这里是Angular所谓的变更检测。这是视图检查。@yurzui我认为一旦调用了ngDoCheck(),就意味着检查了组件的所有绑定(这就是我认为的更改检测)。console.log-in-isVisible未执行,因为该值与上次运行时没有更改。这是我的理解,尽管我可能错了:)。在我有很多项的真实代码中,我可以看到执行这个ngDoCheck()实际上需要很长的时间,并且会导致perf hit,我只是认为当只单击其中一个组件时,它不必对所有子组件执行它?但也许我又错过了一点。。。