Run results for: delete

Run details:

User agent: Mozilla/5.0 (Windows NT 5.1; rv:52.0) Gecko/20100101 Firefox/52.0

Browser: Firefox 52

Operating system: Windows XP

Device Platform: Other

Date tested: 7 years ago

Test name	Executions per second
classList.add/classList.remove	25848.6 Ops/sec
function addClass/function removeClass	9473.5 Ops/sec
jQuery	11047.8 Ops/sec
function addClass/function removeClass 2	13642.0 Ops/sec
function addClass/function removeClass 3	12032.6 Ops/sec
function addClass/function removeClass 4	17294.3 Ops/sec
function addClass/function removeClass 5	8980.3 Ops/sec

HTML Preparation code:

<div id="testElement">Test</div>

Script Preparation code:

var API = API || {};
API.classReg=function(className){return new RegExp("(^|\\s+)"+className+"(\\s+|$)");};

if('classList' in document.documentElement){
	API.addClass=function(o,c){
		var cArr=c.match(/[a-z][a-z0-9_-]*/gi);
		o.classList.add.apply(o.classList,cArr);
	};
	API.removeClass=function(o,c){
		var cArr=c.match(/[a-z][a-z0-9_-]*/gi);
		o.classList.remove.apply(o.classList,cArr);
	};
}

if('classList' in document.documentElement){
	API.addClass1=function(o,c){
		var cArr=c.match(/[a-z][a-z0-9_-]*/gi);
		if(cArr.length==1){o.classList.add(cArr[0]);}else{o.classList.add.apply(o.classList,cArr);}
	};
	API.removeClass1=function(o,c){
		var cArr=c.match(/[a-z][a-z0-9_-]*/gi);
		if(cArr.length==1){o.classList.remove(cArr[0]);}else{o.classList.remove.apply(o.classList,cArr);}
	};
}

var elem = document.getElementById('testElement');

Tests:

classList.add/classList.remove (2 class)
elem.classList.add('classtest','twoclass'); elem.classList.remove('classtest','twoclass');
function addClass/function removeClass (2 class)
API.addClass(elem,'classtest twoclass'); API.removeClass(elem,'classtest twoclass');
function addClass/function removeClass 1 (2 class)
API.addClass1(elem,'classtest twoclass'); API.removeClass1(elem,'classtest twoclass');
jQuery (2 class)
$('#testElement').addClass('classtest twoclass'); $('#testElement').removeClass('classtest twoclass');
classList.add/classList.remove (1 class)
elem.classList.add('classtest'); elem.classList.remove('classtest');
function addClass/function removeClass (1 class)
API.addClass(elem,'classtest'); API.removeClass(elem,'classtest');
function addClass/function removeClass 1 (1 class)
API.addClass1(elem,'classtest'); API.removeClass1(elem,'classtest');
jQuery (1 class)
$('#testElement').addClass('classtest'); $('#testElement').removeClass('classtest');

delete

classList.add/classList.remove (2 class)

function addClass/function removeClass (2 class)

function addClass/function removeClass 1 (2 class)

jQuery (2 class)

classList.add/classList.remove (1 class)

function addClass/function removeClass (1 class)

function addClass/function removeClass 1 (1 class)

jQuery (1 class)