如何分析AngularJS组件中的性能基准?

作为一项要求,我必须分析几个AngularJS组件的性能基准,例如ng-grid,IE8中的数据表,Chrome和& FF对模拟数据.我有模拟数据.

现在使用IE8 Profiler时,我得到了几个函数的时间(ms).根据AngularJS调用结构,$digest时间(包含时间,根据IE8分析器)应反映页面的加载时间,或$digest&的总和. $申请?我是AngularJS的新手,所以对这些概念的解释会很好!

最佳答案 请注意,调用$apply将触发$rootScope上的$digest,这意味着$digest所有子范围.

$apply函数本身相对较轻(您可以在角度源中检查它).这是评估观察者并在$digest期间比较值(脏检查)的过程,这可能会变得昂贵.因此,迄今为止的性能测试一直专注于测量$摘要.一些例子:

How does data binding work in AngularJS?(见Misko的回答)

How Do I Measure the Performance of my AngularJS app’s digest Cycle?

http://blog.scalyr.com/2013/10/angularjs-1200ms-to-35ms/

这是对$apply和$digest:http://www.sitepoint.com/understanding-angulars-apply-digest/之间差异的一个很好的解释.相关摘录:

$摘要:

The $digest cycle starts as a result of a call to $scope.$digest(). Assume that you change a scope model in a handler function through the ng-click directive. In that case AngularJS automatically triggers a $digest cycle by calling $digest(). When the $digest cycle starts, it fires each of the watchers. These watchers check if the current value of the scope model is different from last calculated value. If yes, then the corresponding listener function executes. As a result if you have any expressions in the view they will be updated. In addition to ng-click, there are several other built-in directives/services that let you change models (e.g. ng-model, $timeout, etc) and automatically trigger a $digest cycle.

$适用:

AngularJS … will account for only those model changes which are done inside AngularJS’ context (i.e. the code that changes models is wrapped inside $apply()). Angular’s built-in directives already do this so that any model changes you make are reflected in the view. However, if you change any model outside of the Angular context, then you need to inform Angular of the changes by calling $apply() manually. It’s like telling Angular that you are changing some models and it should fire the watchers so that your changes propagate properly.

点赞