angular - 调试 Angular 2 性能

Question

我注意到我的 Angular 2 应用程序变得有点迟钝。例如，单击按钮(设置某些状态)和显示结果(基于该状态值)之间的时间有一些(~1 秒)延迟。我怀疑在每个更改检测循环期间调用的某些方法存在一些性能问题。

任何人都可以提供指导:

1) 如何计算每个变化检测循环需要多长时间？

2) 如何查明那些对延迟有显着影响的方法调用？

谢谢。

Answer 1

在 chrome 的 Developer tools 中，在“Profiles”面板下，您可以运行分析类型 Record JavaScript CPU Profile，它将记录函数的执行时间，这应该可以帮助您检测哪些函数对您的应用延迟影响最大。

更新

此功能现在位于“性能”面板中 since Chrome 58 .打开“性能”面板和click the "Record" icon开始分析页面。

该选项卡中还有其他类型的配置文件类型也应该对您有所帮助。这是帮助的链接 analyze the Chrome profile停止录制时生成。 Internet Explorer 中也存在类似的功能。