Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
flatMap vs reduce spread vs reduce push
(version: 0)
Comparing performance of:
reduce with spread vs flatMap vs reduce with push
Created:
2 years ago
by:
Guest
Go to the latest result
Script Preparation code:
var arr = Array(10_000).fill(0)
Tests:
reduce with spread
arr.reduce((acc, x) => [...acc, x, x], [])
flatMap
arr.flatMap(x => [x, x])
reduce with push
arr.reduce((acc, x) => (acc.push(x, x), acc), [])
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
reduce with spread
flatMap
reduce with push
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:137.0) Gecko/20100101 Firefox/137.0
Browser/OS:
Firefox 137 on Ubuntu
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=599195" width="100%" height="500px"></iframe>
flatMap
4K/s
reduce with push
4K/s
reduce with spread
2/s
View exact numbers
Test name
Executions per second
✓
flatMap
4,470 Ops/sec
reduce with push
4,153 Ops/sec
reduce with spread
2 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
**Overview of the Benchmark** The provided JSON represents a JavaScript microbenchmarking test created on MeasureThat.net. The benchmark compares three approaches to flatten an array in JavaScript: using `flatMap`, `reduce` with spread, and `reduce` with push. **Approaches Compared** 1. **`arr.flatMap(x => [x, x])`**: This approach uses the `flatMap` method, which is a built-in method in modern JavaScript that flattens an array of arrays into a single array. 2. **`arr.reduce((acc, x) => [...acc, x, x], [])`**: This approach uses the `reduce` method with spread syntax to flatten the array. The callback function takes the accumulator (`acc`) and the current element (`x`) as arguments, and returns a new array by concatenating `acc` with `[x, x]`. 3. **`arr.reduce((acc, x) => (acc.push(x, x), acc), [])`**: This approach uses the `reduce` method without spread syntax to flatten the array. The callback function takes the accumulator (`acc`) and the current element (`x`) as arguments, and pushes `[x, x]` onto `acc`, returning the updated accumulator. **Pros and Cons of Each Approach** 1. **`flatMap`**: Pros: * Efficient use of built-in method * Concise syntax 2. Cons: * May not be supported in older browsers or environments that don't support ES6+ features * Can be slower than other approaches for large arrays due to the overhead of iterating over each element 3. **`reduce with spread`**: Pros: * Clear and concise syntax * Works well for large arrays, as it uses a more efficient algorithm 4. Cons: * May not be supported in older browsers or environments that don't support ES6+ features 5. **`reduce with push`**: Pros: * May be faster than `reduce with spread` due to the optimized implementation of `push` * Works well for large arrays, as it uses a more efficient algorithm Cons: * Syntax can be less readable due to the use of an array method **Library and Special JS Features** There are no libraries used in this benchmark. **Special JS Features** 1. **Spread syntax (`...`)**: Used in `reduce with spread` approach to create a new array by concatenating elements. 2. **Arrow functions**: Used in `reduce with spread` approach to define the callback function for `reduce`. 3. **ES6+ features (e.g., `flatMap`, `let`/`const`)**: Used in the benchmark, but not explicitly highlighted as special features. **Other Alternatives** 1. **Using a loop**: An alternative implementation could use a simple loop to flatten the array, e.g.: `for (var i = 0; i < arr.length; i++) { acc.push(arr[i], arr[i]); }` 2. **Using a library function**: Another alternative could be using a library like Lodash or Ramda to flatten arrays. 3. **Using a custom implementation**: A custom implementation using recursive functions or other approaches could also be used to flatten the array. These alternatives are not included in the benchmark, but they demonstrate that there are multiple ways to approach this problem in JavaScript.
Related benchmarks
Reduce Push vs. flatMap
flatMap vs reduce using push
Reduce Push vs. flatMap with subarrays
Comments
Confirm delete:
Do you really want to delete benchmark?