小编Ste*_*ven的帖子

我正在评估是否将AngularJS用于Web项目,我担心我需要实现的功能的性能.我想知道是否有更好的方法来实现我在AngularJS中尝试的功能.

从本质上讲,在我看来,AngularJS对事件做出反应的时间取决于页面中DOM元素的数量,即使DOM元素没有被主动更改等等.我猜这是因为$ digest函数正在遍历整个DOM ..至少从我的实验来看,似乎就是这种情况.

这是游戏场景(这不是我真正想要做的,但足够接近测试目的).

当我将鼠标悬停在它上面时,我想让angularJS突出显示一个单词.但是,随着页面中单词数量的增加,当您将鼠标悬停在单词上时以及实际突出显示单词时,延迟时间会更长.

显示这个的jsfiddle:http: //jsfiddle.net/czerwin/5qFzg/4/

(信用:此代码基于Peter Bacon Darwin在AngularJS论坛上的帖子).

这是HTML:

<div ng-app="myApp">
    <div ng-controller="ControllerA">
        <div >
            <span ng-repeat="i in list" id="{{i}}" ng-mouseover='onMouseover(i)'>
                {{i}}, 
            </span>
            <span ng-repeat="i in listB">
                {{i}}, 
            </span>
        </div>
    </div>
</div>

这是javascript:

angular.module('myApp', [])
.controller('ControllerA', function($scope) {
    var i;
    $scope.list = [];
    for (i = 0; i < 500; i++) {
        $scope.list.push(i);
    }

    $scope.listB = [];
    for (i = 500; i < 10000; i++) {
        $scope.listB.push(i);
    }

    $scope.highlightedItem = 0;
    $scope.onMouseover = function(i) { …