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

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

问题描述

什么是衡量angularjs的消化周期持续时间的简单方法?存在各种方法来分析消化循环的性能,但是每个都有自己pitfals:

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:


  • 铬探查:太多的细节,不容易找到的方式
  • 分解消化周期
  • Batarang(AngularJS浏览器插件):开销太大,缓慢的刷新率,爆炸与大型应用

  • Chrome Profiler: Too many details, does not break down the digest cycle in an easy-to-find manner
  • Batarang (AngularJS browser plugin): Too much overhead, slow refresh rate, explodes with large apps.

......必须有一个更好的办法?!1?

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

推荐答案

下面是一个秘密。在Chrome开发工具,做一个CPU运行配置文件。你停止捕获后,在屏幕的下方是一个倒三角旁边的重(自下而上)。单击三角形,然后选择火焰图表。一旦你在火焰表模式下,你可以缩放和平移看到摘要周期,他们采取了多久,什么功能都被调用。火焰图是如此对跟踪页面加载问题,NG-重复的性能问题非常有用,消化周期的问题!我真的不知道我怎么能调试和监测火焰图表之前。下面是一个例子:

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天全站免登陆