Benchmark: reduce vs. filter + map vs. forEach - list 100k

Script Preparation code:

function createTeamList(n) {
    var teamList = Array(n);
    for (var i = 0; i < n; i++){
        teamList[i] = {
            id: i,
            isSelected: true,
            name: `team ${i}`
        }
    }
    return teamList;
}

var searchableTeamList = createTeamList(100000);

Tests:

reduce
const selectedTeamIds = searchableTeamList.reduce((ids, team) => { if (team.isSelected) { ids.push(team.id) } return ids; }, []);
filter+map
const selectedTeamIds = searchableTeamList.filter((team) => team.isSelected)?.map((team) => team.id);
forEach
const selectedTeamIds = []; searchableTeamList.forEach((team) => { if (team.isSelected) { selectedTeamIds.push(team.id) } });
for...of
const selectedTeamIds = []; for (const team of searchableTeamList) { if (team.isSelected) { selectedTeamIds.push(team.id) } }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reduce
filter+map
forEach
for...of

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

Let's dive into the provided benchmark and explain what's being tested.

**Benchmark Description**

The test case measures the performance of three different approaches to extract the IDs of selected teams from a list:

1. `reduce`
2. `filter + map`
3. `forEach` (with a for loop equivalent)

The input is an array of objects, each representing a team with an ID, isSelected flag, and name.

**Tested Options**

Here's what's being compared:

* `reduce`: A functional approach that iterates through the array and accumulates the IDs in an accumulator.
* `filter + map`: Two separate operations: filtering out unselected teams and then mapping over the remaining teams to extract their IDs.
* `forEach` (with a for loop equivalent): An iterative approach that uses the `forEach` method to iterate through the array and push the IDs into an accumulator.

**Pros and Cons**

Here's a brief summary of each approach:

* `reduce`: Pros: concise, efficient; Cons: can be less readable due to accumulation of values in the accumulator.
* `filter + map`: Pros: easier to understand, separates concerns; Cons: two separate operations, might lead to overhead from creating an intermediate array.
* `forEach` (with a for loop equivalent): Pros: more readable, doesn't require functional programming knowledge; Cons: can be less efficient due to unnecessary iterations.

**Library and Special JS Features**

None of the test cases use any external libraries or special JavaScript features. They only rely on built-in functionality.

**Other Considerations**

The benchmark is focused on measuring the performance of these three approaches in a contrived scenario, which might not reflect real-world usage. In practice, you might want to consider other factors like:

* Code readability and maintainability
* Robustness against edge cases (e.g., empty arrays, null or undefined values)
* Scalability with larger input sizes

**Alternatives**

If you were to reimplement this benchmark with different approaches, you could also consider:

* `find` + mapping: Using the `find` method to find the first selected team and then mapping over the remaining array.
* Array.prototype.some() + mapping: Using the `some` method to filter out unselected teams and then mapping over the remaining array.
* Recursive functions: Implementing a recursive function that iterates through the array and accumulates the IDs.

Keep in mind that these alternatives might not be as efficient or readable as the original approaches.

Related benchmarks:

reduce vs. filter + map vs. forEach - list 100k (version: 2)

Comparing performance of: reduce vs filter+map vs forEach vs for...of

Created: 2 years ago by: Registered User

Jump to the latest result

reduce

filter+map

forEach

for...of

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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