nextSibling vs childNodes (v24)

Revision 24 of this benchmark created by rob1 on

Description

Test the relative performance of iterating through child nodes using nextSibling vs iterating through the childNodes array.

Preparation HTML

<div id="container">
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
<p>Child</p>
</div>
<script>
  var container = document.getElementById('container');
  
  function process(element) {}
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
childNodes
var len = container.childNodes.length,
    i;
for (i = 0; i < len; i++) {
 process(container.childNodes[i]);
}
ready
childNodes, cached
var nodes = container.childNodes,
    len = nodes.length,
    i;
for (i = 0; i < len; i++) {
 process(nodes[i]);
}
ready
nextSibling
var node = container.firstChild;
while (node) {
 process(node);
 node = node.nextSibling;
}
ready

Revisions

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