jQuery selector vs getElementsByTagName (v2)

Revision 2 of this benchmark created on


Preparation HTML

<div class="pane">
  <ul>
    <li class="list">
      <a href="#">test</a>
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
  </ul>
</div>
<div class="pane">
  <ul>
    <li class="list">
      <a href="#">test</a>
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
    <li class="list">
      test
    </li>
  </ul>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script>
  $.fn.tags = function(tagName) {
    var i = this.length,
        arr = [],
        parent;
    for (i; i--;) {
      arr.push(this[i].getElementsByTagName(tagName));
    }
    return $(arr);
  };
  
  var $links = $('.pane a'),
      $nodes;
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery
$nodes = $('.pane li')[0];
ready
jQuery method with getElementsByTagName
// async test
$nodes = $('.pane').tags('li')[0];
ready

Revisions

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