Benchmark: for vs foreach vs map vs (map, filter reduce)

Tests:

for
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; let sum = 0; for(let i = 0; i < arr.length; i++){ const item = arr[i] * 3; if(item % 4 === 0) sum += item; } console.log(sum);
map, filter, reduce
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; const sum = arr.map(item => item * 3) .filter((item) => item % 4 === 0) .reduce((item, total) => total = total + item); console.log(sum);
forEach
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; let sum = 0; arr.forEach((item)=>{ item = item * 3; if(item % 4 === 0) sum += item; }); console.log(sum);
map
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; let sum = 0; arr.map((item)=>{ item = item * 3; if(item % 4 === 0) sum += item; }); console.log(sum);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
map, filter, reduce
forEach
map

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (iPhone; CPU iPhone OS 12_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.1.1 Mobile/15E148 Safari/604.1

Browser/OS: Mobile Safari 12 on iOS 12.3

View result in a separate tab

Test name	Executions per second
for	176368.9 Ops/sec
map, filter, reduce	129990.7 Ops/sec
forEach	157678.2 Ops/sec
map	140162.6 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks!

**Benchmark Overview**

The benchmark is designed to compare the performance of four different approaches: `for`, `forEach`, `map`, and a combination of `map`, `filter`, and `reduce`. The test cases are identical, except for the approach used to iterate over an array.

**Approaches Compared**

1. **For Loop**: A traditional `for` loop is used to iterate over the array.
2. **ForEach Loop**: An enhanced `forEach` loop is used to iterate over the array.
3. **Map Function**: The `map` function is used to transform each element in the array, and then the resulting array is processed further using other functions (in this case, `filter` and `reduce`).
4. **Map-Filter-Reduce Approach**: A combination of `map`, `filter`, and `reduce` functions are used to process the array.

**Pros and Cons**

* **For Loop**:
	+ Pros: Simple, easy to understand, and widely supported.
	+ Cons: Can be slower due to the overhead of the loop variable and conditional statements.
* **ForEach Loop**:
	+ Pros: More concise than a traditional `for` loop, and can be faster due to the optimized iteration logic.
	+ Cons: May not work as expected in some edge cases (e.g., when modifying the array while iterating).
* **Map Function**:
	+ Pros: Can be faster than a traditional `for` loop, especially for large arrays. The `map` function is also more concise and expressive.
	+ Cons: May require additional processing steps to achieve the desired result.
* **Map-Filter-Reduce Approach**:
	+ Pros: Can be very efficient by leveraging the optimized logic of individual functions. However, it may require more code and understanding of functional programming concepts.
	+ Cons: Can be less readable and maintainable due to the combination of multiple functions.

**Library Usage**

None of the benchmark definitions explicitly use any libraries, but some assumptions can be made:

* The `map` function is assumed to be part of the ECMAScript standard, which is widely supported in modern browsers.
* The `forEach` loop is also assumed to be a built-in function or available through the ECMAScript standard.

**Special JavaScript Features**

None of the benchmark definitions explicitly use any special JavaScript features like `let`, `const`, or arrow functions. However, it's worth noting that using these features can affect performance due to various factors such as caching and compilation optimizations.

**Other Alternatives**

Some alternative approaches to consider:

* **Lodash**: A popular utility library that provides a range of helper functions for common tasks like array manipulation.
* **Array.prototype.reduceRight()**: Instead of using `reduce()` with the accumulator starting at 0, you can use `reduceRight()` with an initial value that represents the sum (e.g., 0).
* **Array.prototype.forEach.call()**: Instead of using `forEach()` on a specific array, you can use `forEach.call()` to apply it to any iterable object.

Keep in mind that these alternatives might not be directly comparable to the original benchmark definitions, as they involve different assumptions and optimizations.

Related benchmarks:

for vs foreach vs map vs (map, filter reduce) (version: 0)

Comparing performance of: for vs map, filter, reduce vs forEach vs map

Created: 5 years ago by: Guest

Jump to the latest result

for

map, filter, reduce

forEach

map

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