jQuery addClass vs dom classList (v34)

Revision 34 of this benchmark created by A on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script src="http://zeptojs.com/zepto.min.js">
</script>
<div class="testDiv">
  <style>
    .class1{ height: 10px }
  </style>

Setup

var testDivJquery = $(".testDiv");

Test runner

Ready to run.

Testing in
TestOps/sec
jquery addClass
testDivJquery.addClass("class1");
ready
js add inline style
testDivJquery[0].style.height = "10px";
ready
jQuery add style
testDivJquery.css('height', '10px');
ready
js add class
testDivJquery.className = testDivJquery.className + " class1";
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.