Jquery Selector Cache (v2)

Revision 2 of this benchmark created on

Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://rawgit.com/farzher/jQuery-Selector-Cache/master/jquery.$$.min.js"></script>
<script src="https://jqache.com/js/jqache-0.1.1.min.js"></script>
<div id="container" style="display: none;">
  <ul>
    <li>
      1
    </li>
    <li class="target">
      2
    </li>
    <li id="target">
      3
    </li>
  </ul>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery with no cache
$('#target').css('border', '1px solid red');
$('#container .target').css('border', '1px solid red');
$('li.target').css('border', '1px solid red');
$('.target').css('border', '1px solid red');
$('#container ul li.target').css('border', '1px solid red');
$('ul li.target').css('border', '1px solid red');
$('div#container ul li.target').css('border', '1px solid red');
$('li#target').css('border', '1px solid red');
ready
Selector Cache Plugin
$$('#target').css('border', '1px solid red');
$$('#container .target').css('border', '1px solid red');
$$('li.target').css('border', '1px solid red');
$$('.target').css('border', '1px solid red');
$$('#container ul li.target').css('border', '1px solid red');
$$('ul li.target').css('border', '1px solid red');
$$('div#container ul li.target').css('border', '1px solid red');
$$('li#target').css('border', '1px solid red');
ready
jQache
$.q('#target').css('border', '1px solid red');
$.q('#container .target').css('border', '1px solid red');
$.q('li.target').css('border', '1px solid red');
$.q('.target').css('border', '1px solid red');
$.q('#container ul li.target').css('border', '1px solid red');
$.q('ul li.target').css('border', '1px solid red');
$.q('div#container ul li.target').css('border', '1px solid red');
$.q('li#target').css('border', '1px solid red');
ready

Revisions

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