Benchmark: Fors comparison - MeasureThat.net

Script Preparation code:

var tab = [];
for (let i = 0; i < 100000; ++i) {
    tab.push({
        a: i.toString(),
        b: i
    });
}

Tests:

for
for(let i = 0; i < 100000; ++i) { tab[i].a = 'aaaaaaaaaaa'; tab[i].b = 0; }
for.. in
for(let index in tab) { tab[index].a = 'bbbbbbbbb'; tab[index].b = 0; }
for...of
for(let obj of tab) { obj.a = 'cccccccccc'; obj.b = 0; }
forEach
tab.forEach((obj) => { obj.a = 'dddddddd'; obj.b = 0; });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
for.. in
for...of
forEach

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36

Browser/OS: Chrome 120 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
for	90.6 Ops/sec
for.. in	59.2 Ops/sec
for...of	3563.6 Ops/sec
forEach	3009.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark.

**Benchmark Overview**

The benchmark compares four different ways to iterate over an array: `for`, `for...in`, `for...of`, and `forEach`. The test case creates an array of 100,000 objects and then iterates over it using each iteration method, performing a simple operation on each object.

**Script Preparation Code**

The script preparation code initializes an empty array `tab` with 100,000 objects:
```javascript
var tab = [];
for (let i = 0; i < 100000; ++i) {
    tab.push({
        a: i.toString(),
        b: i
    });
}
```
This code creates an array of objects where each object has two properties: `a` and `b`, with the latter being an integer value.

**Html Preparation Code**

There is no HTML preparation code provided, which means that this benchmark focuses solely on JavaScript performance.

**Iteration Methods Compared**

The four iteration methods compared are:

1. **For**: Uses a traditional `for` loop with an index variable.
```javascript
for (let i = 0; i < 100000; ++i) {
    tab[i].a = 'aaaaaaaaaaa';
    tab[i].b = 0;
}
```
2. **For...in**: Uses the `in` operator to access array elements, which iterates over both the keys and values of the array.
```javascript
for (let index in tab) {
    tab[index].a = 'bbbbbbbbb';
    tab[index].b = 0;
}
```
3. **For...of**: Uses the `of` keyword to iterate directly over array elements, without needing an index variable.
```javascript
for (let obj of tab) {
    obj.a = 'cccccccccc';
    obj.b = 0;
}
```
4. **ForEach**: Uses the `forEach` method, which is a built-in function that executes a callback function for each element in an array.
```javascript
tab.forEach((obj) => {
    obj.a = 'dddddddd';
    obj.b = 0;
});
```
**Pros and Cons of Each Approach**

1. **For**: Pros: Simple, straightforward, and well-established. Cons: Requires manual indexing, which can be error-prone.
2. **For...in**: Pros: Easy to use, as it doesn't require an index variable. Cons: Iterates over both keys and values, which may not be what you want for arrays with only numerical keys.
3. **For...of**: Pros: Modern, efficient, and easy to read. Cons: Requires ECMAScript 2015+ support (Chrome 120 is a good candidate).
4. **ForEach**: Pros: Easy to use, concise, and modern. Cons: May incur additional overhead due to the callback function.

**Library Usage**

None of the benchmark tests explicitly uses any external libraries. However, if we consider `forEach` as a built-in library (it's not!), then it doesn't require any explicit imports or dependencies.

**Special JS Features/Syntax**

This benchmark does not use any special JavaScript features or syntax, such as async/await, Promises, or `let`/`const` declaration blocks. It focuses solely on the iteration methods themselves.

**Alternative Approaches**

If you want to compare more iteration methods or explore other optimization techniques, some alternatives could include:

* Using `map()` or `reduce()` instead of `forEach`
* Comparing different indexing strategies (e.g., using an array's `map` function)
* Investigating the use of WebAssembly or native modules for performance
* Evaluating the impact of different caching mechanisms on iteration performance

Keep in mind that each alternative approach would require a new benchmark definition and script preparation code.

Related benchmarks:

Fors comparison (version: 0)

for vs for..in vs for..of vs forEach

Comparing performance of: for vs for.. in vs for...of vs forEach

Created: 2 years ago by: Registered User

Jump to the latest result

for

for.. in

for...of

forEach

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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