HTMLCollection vs regular loops

Benchmark created by yotam on

Preparation HTML

<div>
  div1
</div>
<div>
  div2
</div>
<div>
  div3
</div>
<div>
  div4
</div>
<div>
  div5
</div>
<div>
  div6
</div>
<div>
  div7
</div>
<div>
  div8
</div>
<div>
  div9
</div>
<div>
  div10
</div>
<script>
  function bar(a) {};
  var divs = document.getElementsByTagName('div');
  var items = [{}, {}, {}, {}, {}, {}, {}, {}, {}, {}];
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
Iterate divs
for (var i = 0; i < divs.length; ++i) {}
ready
Iterate Array
for (var j = 0; j < items.length; ++j) {}
ready
Iterate divs with func
for (var i = 0; i < divs.length; ++i) {
  bar(divs[i]);
}
ready
Iterate Array with func
for (var j = 0; j < items.length; ++j) {
  bar(divs[j]);
}
ready

Revisions

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