Angular ng-repeat filter compariso

JavaScript performance comparison

Revision 2 of this test case created

Info

Angular test comparing the performance impact of filters on ng-repeat

Preparation code

<script  src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js" ></script>

<repeat></repeat>

<script>
var myApp = angular.module("myApp", []);
</script>
<script>
Benchmark.prototype.setup = function() {
    myApp.controller("appCtrl", function ($scope, $timeout) {
      $scope.items = [];
       
      for (i=0;i < 1000;i++) {
        $scope.items.push("test"+i);
      }
   
      $scope.filterString1="!1";
      $scope.filterString2="!2";
   
     
    });
   
    myApp.directive('repeat', function () {
        return {
            restrict: 'EA',
            template: '{{items}}'
        };
      });
};
</script>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
No repeat
myApp.directive('repeat', function () {
    return {
        restrict: 'EA',
        template: '{{items}}'
    };
  });
pending…
repeat
myApp.directive('repeat', function () {
    return {
        restrict: 'EA',
        template: '<div ng-repeat="item in items"> {{item}}</div>'
    };
  });
pending…
1 filter
myApp.directive('repeat', function () {
    return {
        restrict: 'EA',
        template: '<div ng-repeat="item in items | filter:filterString1"> {{item}}</div>'
    };
  });
pending…
2 filters
myApp.directive('repeat', function () {
    return {
        restrict: 'EA',
        template: '<div ng-repeat="item in items | filter:filterString1 | filter:filterString2"> {{item}}</div>'
    };
  });
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment