Hide with and without jQuery (v4)

Revision 4 of this benchmark created by Vadim on

Description

Hiding an element without jQuery is faster than with jQuery and still only one line of code.

Preparation HTML

<style>.invisible {display:none}</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div>
  <div id="element">My Element</div>

</div>

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery
jQuery( '#element' ).hide();
ready
Non-jQuery
document.getElementById( 'element' ).style.display = 'none';
ready
jQuery: adding class
jQuery( '#element' ).addClass('invisible');
ready
Non-jQuery: adding class
document.getElementById( 'element' ).classList.add('invisible');
ready

Revisions

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

  • Revision 1: published by Taylor Lovett on
  • Revision 2: published by Camwyn on
  • Revision 4: published by Vadim on