Test case details

Preparation Code

<!-- JQURY --> <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> <!-- ANGULAR --> <script src="http://code.angularjs.org/angular-1.0.1.min.js" ng:autobind></script> <script>   var Ctrl=function($scope){         $scope.data=[]; } </script> <div ng:app> <ul ng-controller="Ctrl" id="angList"  > <li ng-repeat="item in data">{{item}}</li> </ul> <script> var SetANG= function(data){ $('#angList').scope().data=data; //Need to do this next line to notify angular that data has been updated $('#angList').scope().$apply(function(){}); }; </script>        <!-- ANGULAR Update -->  <script>   var CtrlUpdate=function($scope){         $scope.data=[]; } </script> <ul ng-controller="CtrlUpdate" id="angListUpdate"  > <li ng-repeat="item in data">{{item}}</li> </ul></div> </div> <script> var SetANGUpdate= function(data){ $('#angListUpdate').scope().data=data; $('#angListUpdate').scope().$apply(function(){}); }; </script>        <!-- EXT --> <script  src="http://docs.sencha.com/ext-js/4-0/extjs-build/ext-all.js"></script> <div id="extme"></div> <script>   var EXTData= [ ]; var store = Ext.create('Ext.data.Store', {     storeId:'employeeStore',     fields:['name' ],     data: EXTData     }); Ext.create('Ext.grid.Panel', {     title: 'Employees',     store: Ext.data.StoreManager.lookup('employeeStore'),          columns: [         {     dataIndex: 'name' }],     renderTo: Ext.getBody() });   var SetEXT=function (data){ store.removeAll(); store.add(data); } </script> <!-- KO --> <script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/2.0.0/knockout-min.js"></script> <script>var KOData=null;</script> KO:<BR><span id="KOTest" data-bind='text: KOData'> </span><BR>  <script> KOData=ko.observable([]); ko.applyBindings(); var SetKO=function (data){ KOData=ko.observable(data); ko.applyBindings(); } </script> <script> var ANG50ID=[]; for (var i=0; i<50;i++){ ANG50ID.push('ITEM'); }; var EXT50ID=[]; for (var i=0; i<50;i++){ EXT50ID.push({name:'ITEM'}); }; var KO50ID=[]; for (var i=0; i<50;i++){ KO50ID.push('ITEM'); }; var ANG100ID=[]; for (var i=0; i<100;i++){ ANG100ID.push('ITEM'); }; var ANG100ID2=[]; for (var i=0; i<100;i++){ ANG100ID2.push('ITEM2'); }; var EXT100ID=[]; for (var i=0; i<100;i++){ EXT100ID.push({name:'ITEM'}); }; var KO100ID=[]; for (var i=0; i<100;i++){ KO100ID.push('ITEM'); }; var ANG1000ID=[]; for (var i=0; i<1000;i++){ ANG1000ID.push('ITEM'); }; var EXT1000ID=[]; for (var i=0; i<1000;i++){ EXT1000ID.push({name:'ITEM'}); }; var KO1000ID=[]; for (var i=0; i<1000;i++){ KO1000ID.push('ITEM'); }; </script>
SetANG([]);     SetEXT([]);     SetKO([]);         SetANGUpdate(ANG100ID);

Test cases

Test #1

SetANG(ANG50ID);  

Test #2

SetKO(KO50ID);

Test #3

SetEXT(EXT50ID);

Test #4

SetANG(ANG100ID);

Test #5

SetKO(KO100ID);

Test #6

SetEXT(EXT100ID);

Test #7

SetANG(ANG1000ID);

Test #8

SetKO(KO1000ID);

Test #9

SetEXT(EXT1000ID);

Test #10

SetANGUpdate(ANG100ID2);