diff --git a/benchmarks/repeat-animate-bp/app-classfilter.js b/benchmarks/repeat-animate-bp/app-classfilter.js new file mode 100644 index 000000000000..6c2708da145f --- /dev/null +++ b/benchmarks/repeat-animate-bp/app-classfilter.js @@ -0,0 +1,9 @@ +'use strict'; + +angular.module('repeatAnimateBenchmark', ['ngAnimate']) + .config(function($animateProvider) { + $animateProvider.classNameFilter(/animate-/); + }) + .run(function($rootScope) { + $rootScope.fileType = 'classfilter'; + }); diff --git a/benchmarks/repeat-animate-bp/app-noanimate.js b/benchmarks/repeat-animate-bp/app-noanimate.js new file mode 100644 index 000000000000..cc99bfcc8cd7 --- /dev/null +++ b/benchmarks/repeat-animate-bp/app-noanimate.js @@ -0,0 +1,6 @@ +'use strict'; + +angular.module('repeatAnimateBenchmark', []) + .run(function($rootScope) { + $rootScope.fileType = 'noanimate'; + }); diff --git a/benchmarks/repeat-animate-bp/app.js b/benchmarks/repeat-animate-bp/app.js new file mode 100644 index 000000000000..e7ac91d7c5fd --- /dev/null +++ b/benchmarks/repeat-animate-bp/app.js @@ -0,0 +1,7 @@ +'use strict'; + +angular.module('repeatAnimateBenchmark', ['ngAnimate']) + .run(function($rootScope) { + $rootScope.fileType = 'default'; + }); + diff --git a/benchmarks/repeat-animate-bp/bp.conf.js b/benchmarks/repeat-animate-bp/bp.conf.js new file mode 100644 index 000000000000..e0f060ef9630 --- /dev/null +++ b/benchmarks/repeat-animate-bp/bp.conf.js @@ -0,0 +1,24 @@ +/* eslint-env node */ + +'use strict'; + +module.exports = function(config) { + config.set({ + scripts: [ + { + id: 'angular', + src: '/build/angular.js' + }, + { + id: 'angular-animate', + src: '/build/angular-animate.js' + }, + { + id: 'app', + src: 'app.js' + }, + { + src: 'common.js' + }] + }); +}; diff --git a/benchmarks/repeat-animate-bp/common.js b/benchmarks/repeat-animate-bp/common.js new file mode 100644 index 000000000000..faa4f77fe760 --- /dev/null +++ b/benchmarks/repeat-animate-bp/common.js @@ -0,0 +1,120 @@ +'use strict'; + +(function() { + var app = angular.module('repeatAnimateBenchmark'); + + app.config(function($compileProvider, $animateProvider) { + if ($compileProvider.debugInfoEnabled) { + $compileProvider.debugInfoEnabled(false); + } + + }); + + app.run(function($animate) { + if ($animate.enabled) { + $animate.enabled(true); + } + }); + + app.controller('DataController', function($scope, $rootScope, $animate) { + var totalRows = 500; + var totalColumns = 20; + + var data = $scope.data = []; + + function fillData() { + if ($animate.enabled) { + $animate.enabled($scope.benchmarkType !== 'globallyDisabled'); + } + + for (var i = 0; i < totalRows; i++) { + data[i] = []; + for (var j = 0; j < totalColumns; j++) { + data[i][j] = { + i: i + }; + } + } + } + + benchmarkSteps.push({ + name: 'enter', + fn: function() { + $scope.$apply(function() { + fillData(); + }); + } + }); + + benchmarkSteps.push({ + name: 'leave', + fn: function() { + $scope.$apply(function() { + data = $scope.data = []; + }); + } + }); + }); + + app.directive('disableAnimations', function($animate) { + return { + link: { + pre: function(s, e) { + $animate.enabled(e, false); + } + } + }; + }); + + app.directive('noop', function($animate) { + return { + link: { + pre: angular.noop + } + }; + }); + + app.directive('baseline', function($document) { + return { + restrict: 'E', + link: function($scope, $element) { + var document = $document[0]; + + var i, j, row, cell, comment; + var template = document.createElement('span'); + template.setAttribute('ng-repeat', 'foo in foos'); + template.classList.add('ng-scope'); + template.appendChild(document.createElement('span')); + template.appendChild(document.createTextNode(':')); + + function createList() { + for (i = 0; i < $scope.data.length; i++) { + row = document.createElement('div'); + $element[0].appendChild(row); + for (j = 0; j < $scope.data[i].length; j++) { + cell = template.cloneNode(true); + row.appendChild(cell); + cell.childNodes[0].textContent = i; + cell.ng339 = 'xxx'; + comment = document.createComment('ngRepeat end: bar in foo'); + row.appendChild(comment); + } + + comment = document.createComment('ngRepeat end: foo in foos'); + $element[0].appendChild(comment); + } + } + + $scope.$watch('data.length', function(newVal) { + if (newVal === 0) { + while ($element[0].firstChild) { + $element[0].removeChild($element[0].firstChild); + } + } else { + createList(); + } + }); + } + }; + }); +})(); diff --git a/benchmarks/repeat-animate-bp/main.html b/benchmarks/repeat-animate-bp/main.html new file mode 100644 index 000000000000..3c21074828a4 --- /dev/null +++ b/benchmarks/repeat-animate-bp/main.html @@ -0,0 +1,70 @@ +
+ Tests rendering of an ngRepeat with 500 elements.
+ Animations can be enabled / disabled in different ways.
+ Two tests require reloading the app with different module / app configurations.
+