Benchmark: Array loop vs foreach vs map forsk2

Script Preparation code:

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

Tests:

foreach
const arrayResult = [] arr.forEach(function (item){ arrayResult.push(someFn(item)); })
for
const arrayResult = [] for (var i = 0, len = arr.length; i < len; i++) { arrayResult.push(someFn(arr[i])); }
map
const arrayResult = arr.map(item => someFn(item))
for prepare
const arrayResult = new Array(arr.length) for (var i = 0, len = arr.length; i < len; i++) { arrayResult.push(someFn(arr[i])); }
foreach prepare
const arrayResult = new Array(arr.length) arr.forEach(function (item){ arrayResult.push(someFn(item)); })

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
foreach
for
map
for prepare
foreach prepare

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/117.0.0.0 Safari/537.36

Browser/OS: Chrome 117 on Linux

View result in a separate tab

Test name	Executions per second
foreach	1676.7 Ops/sec
for	1127.8 Ops/sec
map	2208.1 Ops/sec
for prepare	1130.7 Ops/sec
foreach prepare	1684.1 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 JSON and explain what's being tested, compared, and their pros/cons.

**Benchmark Definition**

The benchmark is designed to compare the performance of three different approaches for executing a loop in JavaScript:

1. `Array.forEach()`
2. `For` loop
3. `Array.map()`

The script preparation code defines an array `arr` with 1000 elements, each containing a function `someFn()` that takes an integer `i` and returns the result of `i * 3 * 8`. The `someFn()` function is not optimized for performance, making it an ideal candidate for benchmarking.

**Individual Test Cases**

Each test case has a unique benchmark definition, which specifies how to execute the `arr` array using one of the three approaches:

1. `foreach`: Uses `Array.forEach()` to iterate over the array and push the result of `someFn(item)` into a new array `arrayResult`.
2. `for`: Uses a traditional `For` loop to iterate over the array and push the result of `someFn(arr[i])` into the same `arrayResult`.
3. `map`: Utilizes `Array.map()` to create a new array `arrayResult` with the results of applying `someFn(item)` to each element in the original `arr` array.
4. `foreach prepare`: Similar to the previous one, but uses `new Array(arr.length)` instead of an existing array for `arrayResult`.
5. `for prepare`: Similar to the previous one, but creates a new empty array for `arrayResult`.

**Comparison and Pros/Cons**

The comparison aims to determine which approach is faster in terms of executions per second.

Pros and cons of each approach:

* `Array.forEach()`: Can be slower due to the overhead of function invocation and the need to push elements into an array. However, it's often considered more concise and easier to read.
* `For` loop: Generally fast but requires manual memory management (assigning values to variables). It can lead to performance issues if not implemented correctly.
* `Array.map()`: Fast and elegant way to apply a function to every element in an array. However, it may incur additional overhead due to the need to create a new array.

**Library Usage**

In this benchmark, the following library is used:

* `Array.prototype.forEach()`: A built-in JavaScript method for iterating over arrays.
* `Array.prototype.map()`: Another built-in JavaScript method for creating a new array with transformed elements.

These libraries are part of the ECMAScript standard and are implemented in most modern browsers.

**Special JS Features or Syntax**

None mentioned in this benchmark. If there were any, it would be worth noting, but not present here.

**Alternatives**

Other approaches that could have been used instead of `Array.forEach()`, `For` loop, and `Array.map()` include:

* `Set.prototype.forEach()`: An alternative iteration method for sets.
* `Array.prototype.reduce()`: A method that applies a function to each element in an array and reduces it to a single output value.
* Custom loops using nested functions or regular expressions.

Keep in mind that these alternatives might introduce additional overhead, depending on the specific use case and browser support.

Related benchmarks:

Array loop vs foreach vs map forsk2 (version: 0)

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

Created: one year ago by: Guest

Jump to the latest result

foreach

for

map

for prepare

foreach prepare

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