className v.s. $.addClass vs tt.addClass (v11)

Revision 11 of this benchmark created by vralle on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script src="https://raw.github.com/dameleon/tt.js/develop/tt.min.js">
</script>
<ul>
  <li class="1">
  </li>
  <li class="2">
  </li>
  <li class="3">
  </li>
  <li class="4">
  </li>
  <li class="5">
  </li>
  <li class="6">
  </li>
  <li class="7">
  </li>
  <li class="8">
  </li>
  <li class="9">
  </li>
  <li class="10">
  </li>
  <li class="11">
  </li>
  <li class="12">
  </li>
  <li class="13">
  </li>
  <li class="14">
  </li>
  <li class="15">
  </li>
  <li class="16" id="submit">
  </li>
</ul>

Setup

var jsId = document.getElementById("submit");
    var $Id = $("#submit");
    var ttId = $("#submit");
    ttId.removeClass("class");
    var jsTags = document.getElementsByTagName("li"), count = jsTags.length;
    var $Tags = $("li");
    var ttTags = $("li");
    ttTags.removeClass("class");

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery (ID)
$Id.addClass("class");
ready
tt(ID)
ttId.addClass("class");
ready
JS (ID)
jsId.className += " class";
ready
JS (ID) HTML5
jsId.classList.add('class');
ready
jQuery (tagName)
$Tags.addClass("class");
ready
tt (tagName)
ttTags.addClass("class");
ready
js (tagName) HTML5
for(var i = 0; i < count; i++) {
        jsTags[i].classList.add('class');
}
ready

Revisions

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