Benchmark: foreach push vs map

Script Preparation code:

var strs = Array.from(new Array(10000)).map(() => 'String concat. ')
var result = []

Tests:

map
result = strs.map((a) => a)
foreach push
strs.forEach(i => { result.push(strs[i]) })

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
map
foreach push

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 27 days ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.6.1 Safari/605.1.15

Browser/OS: Safari 15 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
map	25676.9 Ops/sec
foreach push	209.0 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 definition and test cases.

**Benchmark Definition:**

The benchmark is defined as a comparison between two approaches:

1. Using `Array.prototype.map()` to create a new array with transformed values.
2. Using `forEach` loop to iterate over the array and push each value to a result array.

**Options Compared:**

* `map()`: A method that creates a new array by applying a provided function to each element of an existing array. It returns a new array with the transformed values.
* `forEach`: A method that calls a provided function once for each element in an array, without returning any value.

**Pros and Cons:**

* `map()`:
	+ Pros:
		- Creates a new array with transformed values, which can be useful if you need to process the data further or use it outside the loop.
		- More concise and readable code.
	+ Cons:
		- Creates an additional memory allocation for the new array, which may impact performance in large datasets.
* `forEach`:
	+ Pros:
		- Does not create a new array, which can be beneficial for large datasets or when memory is limited.
	+ Cons:
		- Requires more code to achieve the same result, making it less concise and potentially less readable.

**Library Used:**

None explicitly mentioned in this benchmark. However, `Array.prototype.map()` and `forEach` are built-in methods of the JavaScript array object.

**Special JS Feature/Syntax:**

None mentioned in this specific benchmark.

Now, let's analyze the test results:

The latest benchmark result shows that Chrome 115 on Linux Desktop achieves:

* `map()`: Executions per second (EPS) of approximately 24,817.99609375.
* `forEach push`: EPS of approximately 690.2704467773438.

This suggests that using `map()` is significantly faster than using the `forEach` loop with `push` in this specific benchmark.

**Other Alternatives:**

Other approaches to achieve the same result could include:

1. Using `reduce()` method, which can be more efficient for large datasets.
2. Implementing a custom loop or iterator function instead of relying on built-in methods like `map()` and `forEach`.
3. Utilizing other libraries or frameworks that provide optimized array processing functions.

It's worth noting that the performance difference between these approaches may vary depending on the specific use case, data size, and JavaScript engine being used.

Related benchmarks:

foreach push vs map (version: 0)

Comparing performance of: map vs foreach push

Created: 2 years ago by: Guest

Jump to the latest result

map

foreach push

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