Angular 2 性能和 changeDetection（5 秒内调用 1000 次）
Angular 2 performance and changeDetection (1000 calls in 5 seconds)
所以基本上，我对 angular 2 很陌生，因此我接手了一个项目。
我发现应用程序的性能很慢，这是很有问题的。
我找不到导致性能缓慢的原因。然后我开始注意到很多 ngIf 和 ngFor 的调用函数。当我突然开始记录这些函数时，我发现每秒实际上有数百次调用。
我真的没有什么有趣的代码可以展示，但我想知道这是否正常？
我真的没有发现实际代码有什么问题。当然 ngFor 的结果可以保存到一个变量中，但是对 ngIf 做同样的事情有点困难（而且有点无用？）。我阅读了有关 changeDetection 的信息，但我无法确定它实际触发的频率。
即使不更改网站上的任何内容（只是滚动），对函数的调用也是如此。
I was wondering if this is supposed to be normal?
答案是肯定的。
您将一个函数绑定到您的 ngIf。 Angular 需要跟踪您的函数并尽快渲染条件元素。
如果你有一个带有很多指令的 ngIf，那么你做错了什么。
让您的条件尽可能精简，这样 ChangeDetection 性能就不会损害用户体验。
是的，有时更改检测 运行s 1000 次，尤其是当 DOM 元素被操纵的数量很高时。
例如：对数组的 *ngFor 循环的更改将拆除整个 DOM 并为列表部分重建它。这里变化检测需要每次运行。
虽然这是事实，但您可以遵循一些步骤来避免性能下降。
1) 在您的 *ngFor 循环中使用 trackBy： 这显着提高了性能，因为 angular 尝试仅对changed/new 阵列的一部分，而不是拆除并再次重建整个阵列。
您可以在此处查看实际效果：angular docs
2) 不要在字符串插值中使用函数，如下所示：
<div>the selected color is: {{selectedColor()}}</div>
希望对您有所帮助。
所以基本上，我对 angular 2 很陌生，因此我接手了一个项目。
我发现应用程序的性能很慢，这是很有问题的。
我找不到导致性能缓慢的原因。然后我开始注意到很多 ngIf 和 ngFor 的调用函数。当我突然开始记录这些函数时，我发现每秒实际上有数百次调用。
我真的没有什么有趣的代码可以展示，但我想知道这是否正常？
我真的没有发现实际代码有什么问题。当然 ngFor 的结果可以保存到一个变量中，但是对 ngIf 做同样的事情有点困难（而且有点无用？）。我阅读了有关 changeDetection 的信息，但我无法确定它实际触发的频率。
即使不更改网站上的任何内容（只是滚动），对函数的调用也是如此。
I was wondering if this is supposed to be normal?
答案是肯定的。
您将一个函数绑定到您的 ngIf。 Angular 需要跟踪您的函数并尽快渲染条件元素。
如果你有一个带有很多指令的 ngIf，那么你做错了什么。
让您的条件尽可能精简，这样 ChangeDetection 性能就不会损害用户体验。
是的，有时更改检测 运行s 1000 次，尤其是当 DOM 元素被操纵的数量很高时。
例如：对数组的 *ngFor 循环的更改将拆除整个 DOM 并为列表部分重建它。这里变化检测需要每次运行。
虽然这是事实，但您可以遵循一些步骤来避免性能下降。
1) 在您的 *ngFor 循环中使用 trackBy： 这显着提高了性能，因为 angular 尝试仅对changed/new 阵列的一部分，而不是拆除并再次重建整个阵列。
您可以在此处查看实际效果：angular docs
2) 不要在字符串插值中使用函数，如下所示：
<div>the selected color is: {{selectedColor()}}</div>
希望对您有所帮助。