Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
FilterMap perf
(version: 0)
Comparing performance of:
Filter Map vs FlatMap vs Reduce vs Push
Created:
one year ago
by:
Guest
Jump to the latest result
Script Preparation code:
var ingredientsPerServing = Array(10_000).fill().map(() => { let o = { details: Math.random().toString(), } if (Math.random() > 0.5) o.measurement = { amount: Math.random(), unit: Math.random().toString(), } return o })
Tests:
Filter Map
ingredientsPerServing .filter((ingredient) => { return ingredient.measurement; }) .map((ingredient) => { return { amount: ingredient.measurement.amount, details: ingredient.details, unit: ingredient.measurement.unit, }; }).length
FlatMap
ingredientsPerServing .flatMap((ingredient) => { return !ingredient.measurement ? [] : [{ amount: ingredient.measurement.amount, details: ingredient.details, unit: ingredient.measurement.unit, }]; }).length
Reduce
ingredientsPerServing .reduce((a, ingredient) => { return !ingredient.measurement ? a : [...a, { amount: ingredient.measurement.amount, details: ingredient.details, unit: ingredient.measurement.unit, }]; }, []).length
Push
ingredientsPerServing .reduce((a, ingredient) => { if (ingredient.measurement) a.push({ amount: ingredient.measurement.amount, details: ingredient.details, unit: ingredient.measurement.unit, }); return a; }, []).length
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
Filter Map
FlatMap
Reduce
Push
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) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36
Browser/OS:
Chrome 118 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
Filter Map
3700.3 Ops/sec
FlatMap
692.1 Ops/sec
Reduce
2.4 Ops/sec
Push
5174.6 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided JSON and benchmark results. **Benchmark Definition** The `FilterMap perf` benchmark is testing the performance of different approaches to filter, map, and reduce arrays in JavaScript. The benchmark definition code generates an array of 10,000 objects with random properties, including a measurement property that is present in half of the cases. The benchmark then applies three different operations: 1. **Filter**: Filters out the objects without a measurement property. 2. **FlatMap**: Flattens the filtered array by creating a new array with the measurement amount and other details for each object. 3. **Push**: Accumulates the filtered objects into an array, pushing new objects onto the array as it iterates through the original array. **Options Compared** The benchmark compares the performance of three different approaches: 1. `filter()`: A built-in JavaScript method that returns a new array with only the elements that pass the test implemented by the provided function. 2. `flatMap()`: A built-in JavaScript method that returns a new array with the results of applying the provided function to each element of the original array, and then flattening the result. 3. `reduce()`: A built-in JavaScript method that applies a user-defined function to each element of the array (in this case, pushing new objects onto an accumulator array). **Pros and Cons** Here are some pros and cons of each approach: 1. **Filter()**: * Pros: Efficient, easy to understand, and widely supported. * Cons: Creates a new array, which can lead to memory allocation overhead. 2. **FlatMap()**: * Pros: Simplifies the filtering process by returning an array with flattened results, reducing code complexity. * Cons: May be slower than `filter()` due to additional processing steps. 3. **Reduce()**: * Pros: Allows for accumulative computation and can reduce memory allocation overhead compared to creating new arrays. * Cons: More complex and less intuitive than `filter()` or `flatMap()`, with a steeper learning curve. **Library** None of the benchmark definitions explicitly uses any libraries, but some may rely on external modules (e.g., Lodash) for utility functions. However, since this is a basic JavaScript microbenchmark, the focus is on understanding the built-in methods and their performance characteristics. **Special JS Feature/Syntax** This benchmark does not use any special JavaScript features or syntax beyond the standard array methods. The use of `let` instead of `var` for declaring variables is an example of a more modern JavaScript feature, but it is not specific to this benchmark. **Other Alternatives** If you were to optimize this benchmark further, you might consider: 1. **Using SIMD instructions**: If performance-critical, using SIMD (Single Instruction, Multiple Data) instructions could provide significant speedups for certain operations. 2. **Caching intermediate results**: If the same data is used repeatedly, caching intermediate results could reduce memory allocation overhead and improve performance. 3. **Parallelizing computation**: With a sufficient number of CPU cores, parallelizing the computation using Web Workers or parallel processing libraries (e.g., ` worker_threads` in Node.js) could further optimize performance. Keep in mind that these optimizations would depend on the specific requirements and constraints of your use case. Overall, this benchmark provides a good starting point for understanding the performance characteristics of built-in JavaScript methods like `filter()`, `flatMap()`, and `reduce()`.
Related benchmarks:
Lodash vs Native Filters : BabbleTech 01
slice vs filter more than 1000
Test filter and map
Test filter and map123
slice vs filter 2
Comments
Confirm delete:
Do you really want to delete benchmark?