Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
reducer function performance
(version: 0)
Testing ops/sec between creating a new array w/ spread initializer vs accumulator.push() in array.reduce()
Comparing performance of:
New array with spread vs Accumulator push
Created:
6 years ago
by:
Guest
Jump to the latest result
Tests:
New array with spread
const testData = [...Array(100000).keys()]; const evens = testData.reduce((acc, v) => { if(v % 2 === 0) { acc = [...acc, v]; } return acc; }, []); console.log(evens.length);
Accumulator push
const testData = [...Array(100000).keys()]; const evens = testData.reduce((acc, v) => { if(v % 2 === 0) { acc.push(v); } return acc; }, []); console.log(evens.length);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
New array with spread
Accumulator push
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
gemma2:9b
, generated one year ago):
This benchmark tests the performance of two different methods for filtering even numbers from an array in JavaScript: **Method 1: New Array with Spread (`...`) Operator:** ```javascript const testData = [...Array(100000).keys()]; // Creates an array of 100,000 numbers from 0 to 99,999 const evens = testData.reduce((acc, v) => { if (v % 2 === 0) { acc = [...acc, v]; // Create a new array with the current value if it's even } return acc; }, []); // Start with an empty accumulator array console.log(evens.length); ``` **Method 2: Accumulator `push()` Method:** ```javascript const testData = [...Array(100000).keys()]; const evens = testData.reduce((acc, v) => { if (v % 2 === 0) { acc.push(v); // Add the current value to the accumulator array if it's even } return acc; }, []); console.log(evens.length); ``` **Pros and Cons:** * **Method 1 (Spread Operator):** * **Pro:** Potentially more readable for some developers due to its explicit creation of new arrays. * **Con:** Creating a new array in every iteration can be memory-intensive, especially with large datasets. * **Method 2 (Accumulator `push()`):** * **Pro:** More efficient in terms of memory usage as it modifies the existing accumulator array. * **Con:** Can be less readable for some developers compared to Method 1's explicit array creation. **Other Considerations:** * **Data Size:** For smaller datasets, the performance difference between the two methods might be negligible. The impact becomes more noticeable with larger arrays due to memory allocation overhead. * **Profiling Tools:** Use profiling tools like Chrome DevTools to analyze the actual execution time and memory usage of each method for your specific use case and data size. **Alternatives:** * **Filtering using Array Methods:** You could use `filter()` directly instead of `reduce()`, which might be more performant: ```javascript const evens = testData.filter(v => v % 2 === 0); ``` Let me know if you have any other questions!
Related benchmarks:
Spread vs mutating
reducer function performance v2
reduce() push vs reduce() spread
flatMap vs reduce spread vs reduce push
Comments
Confirm delete:
Do you really want to delete benchmark?