classList vs jQuery

Benchmark created by Jeremias Menichelli on


Description

Let's check if jQuery is THAT bad against classList functions...

Preparation HTML

<div id="test-element"></div>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

Setup

var jElement = $('#test-element');
    var htmlElement = document.querySelector('#test-element')

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery
jElement.addClass('first-class');
jElement.hasClass('first-class');
jElement.toggleClass('first-class');
jElement.addClass('another-class');
jElement.removeClass('another-class');
ready
classList
htmlElement.classList.add('first-class');
htmlElement.classList.contains('first-class');
htmlElement.classList.toggle('first-class');
htmlElement.classList.add('another-class');
htmlElement.classList.remove('another-class');
ready

Revisions

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

  • Revision 1: published by Jeremias Menichelli on
  • Revision 3: published by quemasda quiensoy on