Benchmark: for vs foreach vs for..of vs for..of over large entries 2

Script Preparation code:

const array = Array.from({length: 10000});
let t;

Tests:

for
for (let i = 0; i < array.length; i++) { t = array[i]; }
foreach
array.forEach((v) => { t = v; });
for..of
for (const v of array) { t = v; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
foreach
for..of

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.0.0 Safari/537.36

Browser/OS: Chrome 132 on Windows

View result in a separate tab

Test name	Executions per second
for	1839.6 Ops/sec
foreach	1885.0 Ops/sec
for..of	1881.7 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

LLMs can make mistakes. Check important info.

The benchmark represented in the provided JSON is designed to compare the performance of different loop constructs in JavaScript: traditional `for` loops, the `forEach` method, and `for..of` loops. Here’s a breakdown of what is being tested:

### Benchmark Overview

- **Name**: Comparison of Loop Performance
- **Purpose**: To measure how efficiently each loop structure traverses a large array containing 10,000 elements.

### Defined Test Cases

1. **`for` Loop**:
   ```javascript
   for (let i = 0; i < array.length; i++) {
       t = array[i];
   }
   ```
   This traditional loop initializes a counter, checks the condition, and accesses each element by its index.

**Pros**:
   - Generally the fastest option for simple iterations.
   - Greater control over for loop variables and the ability to break or return at any point.

**Cons**:
   - More boilerplate; writing index-based loops can be prone to errors, such as off-by-one errors.

2. **`forEach` Method**:
   ```javascript
   array.forEach((v) => {
       t = v;
   });
   ```
   This method takes a callback function which is executed for each element in the array.

**Pros**:
   - Cleaner, more readable syntax compared to traditional loops.
   - Avoids potential issues with index management.

**Cons**:
   - Generally slower than the traditional `for` loop since it involves function calls for every iteration.
   - No direct way to break from the loop.

3. **`for..of` Loop**:
   ```javascript
   for (const v of array) {
       t = v;
   }
   ```
   This syntax allows iteration over iterable objects and provides the value directly.

**Pros**:
   - Very readable and straightforward.
   - Auto-iterates through elements without needing to manage a counter or index.
   - Also allows easier use of `break` and `continue`.

**Cons**:
   - Typically slower than the traditional `for` loop.
   - May have performance implications when processing large datasets due to overhead of iterators.

### Benchmark Results

The results provided indicate that the `for` loop had the highest performance, with an execution rate of approximately 1554.76 executions per second. The `forEach` method came in second at about 1531.27, followed closely by `for..of` at around 1527.50. This data showcases the expected performance characteristics—though modern JavaScript engines optimize these patterns significantly, traditional `for` loops often remain the fastest.

### Other Considerations and Alternatives

When evaluating the best loop construct to use, consider the context and requirements of your code.

- **When to Use Each**:
  - Use `for` when performance is critical and you need full control over the index, especially in scenarios with large datasets.
  - Use `forEach` for cleaner and more readable code where performance is not the primary concern.
  - Use `for..of` when dealing with collections that are not inherently array-like, such as `Map` or `Set`, or when readability is a priority.

- **Alternatives**: 
  - **`map`, `filter`, and other Array methods** provide functional paradigms for transforming arrays but create new arrays as output. These can be slower but may improve code clarity for developers familiar with functional programming techniques. 
  - **While loops** or **do..while loops** can be alternatives in specific scenarios, but they are less common for simple array traversal.

Ultimately, performance testing and profiling in the specific context of your application should guide the choice of method for array iteration.

Related benchmarks:

for vs foreach vs for..of vs for..of over large entries 2 (version: 1)

Compare loop performance

Comparing performance of: for vs foreach vs for..of

Created: one year ago by: Guest

Jump to the latest result

for

foreach

for..of

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):