Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
flatMap vs reduce vs filter.map v2
(version: 0)
Comparing performance of:
flatMap() vs reduce() vs filter().map()
Created:
2 years ago
by:
Registered User
Go to the latest result
Script Preparation code:
var arr = Array.from({length: 20}, () => Math.floor(Math.random() * 100));;
Tests:
flatMap()
arr.flatMap((e) => e > 50 ? e / 2 : []);
reduce()
arr.reduce((acc, curr) => curr > 50 ? (acc.push(curr / 2), acc) : acc, []);
filter().map()
arr.filter((e) => e > 50).map((e) => e / 2);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
flatMap()
reduce()
filter().map()
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; rv:136.0) Gecko/20100101 Firefox/136.0
Browser/OS:
Firefox 136 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=591281" width="100%" height="500px"></iframe>
reduce()
10.1M/s
filter().map()
5.4M/s
flatMap()
2.9M/s
View exact numbers
Test name
Executions per second
✓
reduce()
10,103,457 Ops/sec
filter().map()
5,422,950 Ops/sec
flatMap()
2,906,483 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net. **Benchmark Overview** The provided JSON represents a benchmarking test that compares three different approaches to process an array of random numbers: 1. `flatMap()` 2. `reduce()` 3. `filter().map()` (composition of filter and map functions) Each approach is designed to filter out elements greater than 50, perform some operation on the remaining elements, and return a new array. **Benchmark Preparation Code** The script preparation code generates an array of 20 random numbers between 0 and 100 using the `Array.from` method. This initialization step is crucial for fair comparisons across different approaches. **Options Compared** Here's a brief overview of each option: 1. **`flatMap()`**: The `flatMap()` method returns a new array with the results of applying the provided function on every element in this array, without calling the `valueOf` method on that element. It also calls the provided function once for each element. 2. **`reduce()`**: The `reduce()` method applies a binary function to all items in an array and reduces it to a single value. In this benchmark, it's used with a custom callback function to filter out elements greater than 50, push the result (i.e., dividing by 2) onto an accumulator array, and return the final array. 3. **`filter().map()`**: This approach uses two separate methods: `filter()` removes all elements that don't meet the provided condition, while `map()` applies a given function to every element in the resulting array, effectively mapping each element greater than 50 to its half. **Pros and Cons** Here's a summary of the pros and cons for each approach: * **`flatMap()`**: Pros: More efficient use of resources since it doesn't create intermediate arrays. Cons: May not be as readable or intuitive due to its concise syntax. * **`reduce()`**: Pros: Allows for more control over the processing pipeline and can be useful when working with complex data structures. Cons: Can be slower in some cases due to the overhead of binary operations. * **`filter().map()`**: Pros: More readable and easier to understand, especially for developers familiar with imperative programming. Cons: Creates intermediate arrays, which might lead to increased memory usage. **Library Used (None)** This benchmark does not rely on any external libraries. The built-in JavaScript methods (`Array.prototype.flatMap()`, `Array.prototype.reduce()`, and `Array.prototype.filter()` along with `Array.prototype.map()`) are used to implement each approach. **Special JS Feature/ Syntax** There is no special JavaScript feature or syntax being tested in this benchmark. It focuses on the inherent performance characteristics of different array processing methods. **Other Alternatives** For more comprehensive comparisons, you might consider exploring other approaches to array processing, such as: * Using `Array.prototype.forEach()` instead of `map()` * Implementing custom iteration using a `for...of` loop or a `while` loop * Utilizing `setInterval()` for time-based measurements Keep in mind that the choice of approach depends on the specific use case and requirements.
Related benchmarks
flatMap vs reduce vs filter.map
flatMap vs reduce filtering performance
flatMap vs reduce vs loop filtering vs filter/map performance
Flat map + filter vs. Reduce
Comments
Confirm delete:
Do you really want to delete benchmark?