我如何衡量我的 AngularJS 应用程序的摘要周期的性能? [英] How Do I Measure the Performance of my AngularJS app's digest Cycle?

查看:28
本文介绍了我如何衡量我的 AngularJS 应用程序的摘要周期的性能?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

测量 angularjs 摘要周期持续时间的简单方法是什么?有多种方法可以分析摘要循环的性能,但每种方法都有其自身的缺陷:

What is a simple way to measure the duration of the angularjs digest cycle? There exist various methods to analyze the performance of the digest cycle, however each comes with its own pitfals:

  • Chrome Profiler:细节太多,无法以易于查找的方式分解摘要周期
  • Batarang(AngularJS 浏览器插件):开销太大,刷新速度慢,大型应用程序爆炸.

...一定有更好的方法?!1?

... there must be a better way ?!1?

推荐答案

这是一个秘密.在 chrome 开发工具中,运行 cpu 配置文件.停止捕捉后,屏幕底部的Heavy (Bottom Up)"旁边是一个向下的三角形.单击三角形并选择火焰图".进入火焰图模式后,您可以缩放和平移以查看摘要周期、它们花费的时间以及正在调用的确切函数.Flame Chart 对于跟踪页面加载问题、ng-repeat 性能问题、消化周期问题非常有用!我真的不知道我是如何在 Flame Chart 之前进行调试和分析的.下面是一个例子:

Here's a secret. In the chrome dev tools, do a cpu profile run. After you have stopped capturing, at the bottom of the screen is a down triangle next to "Heavy (Bottom Up)". Click the triangle and select "Flame Chart". Once you are in Flame Chart mode, you can zoom and pan to see the digest cycles, how long they take, and exactly what functions are being called. The Flame Chart is so incredibly useful for tracking down page load issues, ng-repeat performance problems, digest cycle problems! I really don't know how I was able to debug and profile before the Flame Chart. Here is an example:

这篇关于我如何衡量我的 AngularJS 应用程序的摘要周期的性能?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆