Loop through HTMLCollection

Benchmark created on


Preparation HTML

<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>
<div class="text">Test test test test</div>

Setup

const collection = document.getElementsByClassName("text");
let x;

const loopSize = 1000;

Test runner

Ready to run.

Testing in
TestOps/sec
Spread operator
for (let i = 0; i < loopSize; i++)
{
	const list = [...collection];
	for (let i = 0; i < list.length; i++)
		x = list[i];
}
ready
Array from
for (let i = 0; i < loopSize; i++)
{
	const list = Array.from(collection);
	for (let i = 0; i < list.length; i++)
		x = list[i];
}
ready
Random access
for (let i = 0; i < loopSize; i++)
{
	for (let i = 0; i < collection.length; i++)
		x = collection[i];
}
ready
For...of
for (let i = 0; i < loopSize; i++)
{
	for (const element of collection)
		x = element;
}
ready

Revisions

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