Benchmark: for vs forEach vs for-of vs for-reverse (calculate sum)

Script Preparation code:

var array = Array.from({length: 100}, (_, index) => index);

Tests:

for
var sum = 0 for (var i = 0; i < array.length; i++) { sum += array[i]; }
forEach
var sum = 0 array.forEach(function(item) { sum += item; });
for-of
var sum = 0 for (var item of array) { sum += item; }
for-reverse
var sum = 0 for (var i = array.length; i--;) { sum += array[i]; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
forEach
for-of
for-reverse

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 years ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:97.0) Gecko/20100101 Firefox/97.0

Browser/OS: Firefox 97 on Windows

View result in a separate tab

Test name	Executions per second
for	8274042.5 Ops/sec
forEach	3496386.0 Ops/sec
for-of	1085609.8 Ops/sec
for-reverse	7302748.5 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested, compared, and their pros and cons.

**Benchmark Overview**

The benchmark is designed to compare the performance of four different ways to iterate over an array in JavaScript: `for`, `forEach`, `for-of`, and `for-reverse`. The goal is to determine which approach is the most efficient for a specific use case: calculating the sum of all elements in an array.

**Benchmark Definitions**

The benchmark consists of four test cases, each with its own script preparation code and HTML preparation code (which is empty in this case). Here's a brief explanation of each test case:

1. `for`: A traditional `for` loop that uses a manual index variable (`i`) to iterate over the array.
2. `forEach`: The `forEach()` method, which iterates over an array using a callback function.
3. `for-of`: The `for...of` loop, which is a more modern and concise way to iterate over arrays using destructuring.
4. `for-reverse`: A modified `for` loop that starts from the end of the array (i.e., `array.length - 1`) and decrements the index variable (`i`) until it reaches 0.

**Comparison**

The benchmark measures the execution speed of each test case, which is represented by the `ExecutionsPerSecond` value. The lower the value, the faster the loop iteration.

Here's a brief comparison of the approaches:

* **`for` and `for-reverse`**: These two loops are similar, but with opposite iterations (i.e., incrementing vs decrementing). The `for` loop is generally slower because it requires manual indexing, while the `for-reverse` loop can take advantage of the array's internal indexing.
* **`forEach` and `for-of`**: Both these loops use a more modern and concise approach to iteration. However, `forEach` uses a callback function, which may incur additional overhead due to function invocation and argument passing. On the other hand, `for-of` is more efficient because it doesn't require explicit indexing or callback functions.

**Pros and Cons**

Here are some pros and cons of each approach:

* **`for`**:
	+ Pros: Simple and widely supported.
	+ Cons: Manual indexing can lead to errors and performance issues.
* **`forEach`**:
	+ Pros: Concise and easy to read, but may incur additional overhead due to callback functions.
	+ Cons: May not be suitable for all use cases (e.g., when you need direct access to array elements).
* **`for-of`**:
	+ Pros: More modern and concise, with fewer potential errors than traditional `for` loops.
	+ Cons: Requires JavaScript 6 or later support, and may not work in older browsers or environments.
* **`for-reverse`**:
	+ Pros: Can take advantage of the array's internal indexing, leading to better performance.
	+ Cons: Less intuitive than traditional `for` loops.

**Library Usage**

There is no explicit library usage mentioned in this benchmark. However, it's worth noting that some JavaScript engines (e.g., V8) have built-in optimizations for certain loop constructs (e.g., `for-of`). These optimizations may affect the performance results.

**Special JS Features or Syntax**

This benchmark doesn't use any special JavaScript features or syntax beyond what's standard in modern JavaScript.

Related benchmarks:

for vs forEach vs for-of vs for-reverse (calculate sum) (version: 0)

for vs forEach vs for-of vs for-reverse

Comparing performance of: for vs forEach vs for-of vs for-reverse

Created: 2 years ago by: Guest

Jump to the latest result

for

forEach

for-of

for-reverse

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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