Test case details

Preparation Code

<!-- Jquery --> <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/json3/3.2.4/json3.min.js"></script> <!-- Angular --> <div ng-app>   <p>Angular:</p>   <span ng-controller="Ctrl" id="angList"><span ng-repeat="item in data">{{item}}</span></span> </div> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <script>   var Ctrl = function($scope){     $scope.data = [];   }   angular.element(document).ready(function() {     window.ANGAPP = {       scope: $('#angList').scope(),       push: function(data){         this.scope.data.push(data);       },       clear: function(){         this.scope.data = [];         this.scope.$digest();       }     };   }); </script> <!-- Knockout --> <div id="koapp">   <p>Knockout:</p>   <span data-bind="foreach: data"><span data-bind="text: $data"></span></span> </div> <script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/2.3.0/knockout-min.js"></script> <script>   var KOData = ko.observableArray();   var KOviewmodel = {data: KOData};     ko.applyBindings(KOviewmodel, document.getElementById('koapp'));   var KOclear = function (){     KOData.splice(0, KOData().length);   };   var KOpush = function (data){     KOData.push(data);   };   var KOunwrap = function(value){     // Source: http://jsperf.com/ko-unwrapobservable/2     return ('function'===typeof(value)) ? value(): value;   }; </script> <!-- Ember --> <div id="emapp">   <p>Ember:</p>   <script type="text/x-handlebars">     <span>       {{#each EMapp.data}}<span>{{this}}</span>{{/each}}     </span>   </script> </div> <script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script> <script src="http://builds.emberjs.com.s3.amazonaws.com/ember-1.0.0-rc.7.min.js"></script> <script>   EMapp = Ember.Application.create({     rootElement: $('#emapp')   });   EMapp.data = Ember.A();     EMclear = function () {     EMapp.get('data').clear();   };   EMreset = function () {     EMapp.set('data', Ember.A());   };   EMpush = function (data) {     EMapp.get('data').pushObject(data);   }; </script>

Test cases

Test #1

ANGAPP.clear(); for (var i = 0; i < 100; i++)   ANGAPP.push(i); ANGAPP.scope.$digest();

Test #2

ANGAPP.clear(); for (var i = 0; i < 100; i++)   ANGAPP.push(i); ANGAPP.scope.$digest();

Test #3

KOclear(); for (var i = 0; i < 100; i++)   KOpush(i);

Test #4

KOclear(); var list = ko.utils.unwrapObservable(KOData); for (var i = 0; i < 100; i++)   list.push(i); KOData.valueHasMutated();

Test #5

KOclear(); var list = KOunwrap(KOData); for (var i = 0; i < 100; i++)   list.push(i); KOData.valueHasMutated();

Test #6

EMclear(); for (var i = 0; i < 100; i++) {   EMpush(i); }

Test #7

Ember.run(function() {   EMclear();   for (var i = 0; i < 100; i++) {     EMpush(i);   } });

Test #8

Ember.run(function() {   EMreset();   for (var i = 0; i < 100; i++) {     EMpush(i);   } });