Benchmark: for vs for...of vs Array.reduce

Script Preparation code:

var arr = [];
for (var i = 0; i < 100; i++) {
  arr.push(i);
}

Tests:

for
var acc = 0; for (var i = 0; i < arr.length; i++) { acc += arr[i]; }
for...of
var acc = 0; for (var n of arr) { acc += n; }
Array.reduce
arr.reduce((acc, current) => acc + current, 0);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
for...of
Array.reduce

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Measuring the performance of different looping mechanisms in JavaScript is an essential task for any developer who wants to optimize their code.

**What is being tested?**

The provided benchmark tests three different ways to compute the sum of each item in an array:

1. **Traditional `for` loop**: This approach uses a traditional `for` loop with a manual index variable.
2. **`for...of` loop**: This approach uses a newer `for...of` loop, which is designed for iterating over arrays and other iterable objects.
3. **`Array.reduce()` method**: This approach uses the `reduce()` method of the Array prototype, which applies a callback function to each element in the array.

**Options compared**

The three options are compared in terms of their execution speed.

**Pros and Cons:**

* **Traditional `for` loop**:
	+ Pros: Easy to understand and implement, works well with arrays of fixed length.
	+ Cons: Manual index management can be error-prone, slower than other methods due to the overhead of incrementing the index variable.
* **`for...of` loop**:
	+ Pros: Modern, efficient, and easy to read, as it eliminates manual index management. Works well with arrays and other iterable objects.
	+ Cons: Only works with arrays and other iterable objects; may have performance issues if not optimized correctly.
* **`Array.reduce()` method**:
	+ Pros: Concise, expressive, and can be used for more complex reductions than just simple sums.
	+ Cons: May have higher overhead due to the creation of an accumulator object.

**Library usage**

The `Array.reduce()` method uses the `reduce()` function from the Array prototype. This is a built-in JavaScript method that applies a callback function to each element in the array, accumulating a result.

**Special JS feature or syntax**

None mentioned in this benchmark.

**Other alternatives**

Some other looping mechanisms that could be tested in a similar benchmark include:

* `forEach()`: While not as efficient as `for` loops or `Array.reduce()`, it can still provide good performance for simple iteration tasks.
* Closures: Using closures to create functions that iterate over arrays can also be an alternative, but may have higher overhead due to the creation of new function objects.

Overall, the choice of looping mechanism depends on the specific use case and performance requirements. The `for` loop is a reliable and efficient option for simple iteration tasks, while `for...of` loops provide a modern alternative with good performance characteristics. The `Array.reduce()` method offers a concise and expressive way to perform complex reductions, but may have higher overhead in some cases.

Related benchmarks:

for vs for...of vs Array.reduce (version: 0)

Computing the sum of each item in an array via different looping mechanisms

Comparing performance of: for vs for...of vs Array.reduce

Created: 5 years ago by: Guest

Jump to the latest result

for

for...of

Array.reduce

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):