Benchmark: Array loop vs foreach vs map 100 000

Script Preparation code:

   var arr = [];
    for (var i = 0; i < 100000; i++) {
      arr[i] = i;
    }
  
    function someFn(i) {
      return i * 3 * 8;
    }

Tests:

foreach
arr.forEach(function (item){ someFn(item); })
for
for (var i = 0, len = arr.length; i < len; i++) { someFn(arr[i]); }
map
arr.map(item => someFn(item))
for of
for (var a of arr) { someFn(a); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
foreach
for
map
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/111.0.0.0 Safari/537.36 Edg/111.0.1661.62

Browser/OS: Chrome 111 on Windows

View result in a separate tab

Test name	Executions per second
foreach	88.8 Ops/sec
for	50.1 Ops/sec
map	81.8 Ops/sec
for of	99.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into explaining the benchmark.

The provided JSON represents a JavaScript microbenchmark that compares the performance of three different approaches to iterate over an array: `forEach`, `for` loop, and `map`. The test case uses a simple function `someFn(i)` that multiplies the input by 3 and 8.

**Options being compared:**

1. **forEach**: This method is called on each element in the array, passing a callback function as an argument.
2. **for` loop**: A traditional loop using a `var i` variable to iterate over the array indices, accessing elements directly with `arr[i]`.
3. **map`: This method returns a new array with the results of applying the provided function to each element in the original array.

**Pros and cons:**

*   **forEach**: Pros:
    *   Easy to read and write.
    *   Implicit iteration, reducing boilerplate code.
    Cons:
    *   Can be slower due to callback overhead.
*   **for` loop**: Pros:
    *   Fast and direct access to elements.
    Cons:
    *   More verbose, requiring explicit index management.
*   **map**: Pros:
    *   Can be faster for simple transformations (cache misses reduced).
    Cons:
    *   Creates a new array, potentially using more memory.

**Other considerations:**

*   The test case uses a small array size of 100,000 elements. For larger arrays, the performance differences between these approaches may become more pronounced.
*   The `someFn` function is simple and doesn't exhibit any special JavaScript features or syntax that might influence the results.
*   The benchmark doesn't account for any potential side effects or changes to the original array.

**Library:**

There are no libraries used in this test case.

**Special JS feature or syntax:**

None of the approaches rely on specific JavaScript features or syntax beyond standard iteration methods.

Related benchmarks:

Array loop vs foreach vs map 100 000 (version: 0)

Comparing performance of: foreach vs for vs map vs for of

Created: one year ago by: Guest

Jump to the latest result

foreach

for

map

for of

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):