BSI.tag() vs jQuery() vs DOM for #li > li (v7)

Revision 7 of this benchmark created on

Description

Testing performance of DOM child selector methods. CSS queries are not used - at least not explicitly. Internal workings of the frameworks tested MAY use them internally.

Preparation HTML

<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://bytes1.dyndns.org/BSI/website-app.js"></script>
<ul id="list">
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
  <li>Placeholder text</li>
</ul>

Test runner

Ready to run.

Testing in
TestOps/sec
Native DOM
document.getElementById('list').getElementsByTagName('li');
ready
Native DOM w/ children
document.getElementById('list').children
ready
$().get().getElementsByTagName()
$('#list').get(0).getElementsByTagName('li');
ready
BSI.id().Node.getElementsByTagName()
BSI.id('list').Node.getElementsByTagName('li');
ready
$().children() w/ filter
$('#list').children('li');
ready
$().children() w/out filter
$('#list').children();
ready
$().find()
$('#list').find('li');
ready
$() w/ context
$('li', '#list');
ready
BSI.tag()
BSI.tag('li', 'list');
ready

Revisions

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