Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array.reduce vs for of loop with set
(version: 1)
A test summing 1000 random numbers, 1 - 10000
Comparing performance of:
reduce vs for loop
Created:
one year ago
by:
Guest
Jump to the latest result
Script Preparation code:
// Create an array of 1000 random intergers between 1 and 10000 var arrRandom = []; for(var intCtr=0; intCtr<1000; intCtr++) { arrRandom.push(Math.floor(Math.random() * Math.floor(10000))); } function reduceCallback(accum, curr) { return accum.add(curr); } function doRedeuce(pArray) { return pArray.reduce(reduceCallback, new Set()); } function doLoop(pArray) { var accum = new Set(); for(const item of pArray) { accum.add(item); } return accum; }
Tests:
reduce
var redeuceResult=0; redeuceResult = doRedeuce(arrRandom);
for loop
var loopResult=0; loopResult = doLoop(arrRandom);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
reduce
for loop
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/133.0.0.0 Safari/537.36
Browser/OS:
Chrome 133 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=587930" width="100%" height="500px"></iframe>
Test name
Executions per second
reduce
48521.2 Ops/sec
for loop
52923.6 Ops/sec
Autogenerated LLM Summary
(model
gpt-4o-mini
, generated one year ago):
The benchmark described in the provided JSON focuses on comparing two different methods for summing up a set of random integers: using the `Array.prototype.reduce()` method versus a `for...of` loop. Both methods ultimately aim to accumulate the values from an array into a `Set`, which inherently manages unique values. ### Options Compared 1. **Array.reduce() Method (`doRedeuce` function)**: - This function uses the `reduce` method of arrays, which takes a callback function and an initial accumulator. - The callback (defined as `reduceCallback`) adds the current number to a `Set`, which stores only unique values. 2. **For...of Loop (`doLoop` function)**: - This function iterates over each item in the array using the `for...of` loop construct. - Each element is added directly to a `Set`, accumulating unique values without needing a separate callback function. ### Pros and Cons #### `Array.reduce()` **Pros**: - Functional programming style: It aligns with a more functional approach to writing JavaScript, often seen as cleaner and less error-prone. - Can easily be adapted for other tasks, such as transforming or filtering the array in more complex scenarios. **Cons**: - Potentially less performant than traditional loops, especially for large datasets. This is due to the overhead of the function calls involved with each iteration. - May be harder to read for developers who aren't as familiar with functional patterns in JavaScript. #### `For...of Loop` **Pros**: - Generally faster for this type of operation, as it is a simple iteration construct with less overhead. - More intuitive for developers coming from imperative programming backgrounds, making it easier for many to read and understand. **Cons**: - Less concise than the functional approach; may require more lines of code if more complex operations are needed. - Mixing paradigm styles (imperative with functional) can lead to more complex codebases if not managed properly. ### Other Considerations - Using a `Set` ensures that only unique values are stored in both methods, which is a key requirement of the task. - The random numbers generated range from 1 to 10,000, and the test benchmarks effectiveness over 1,000 iterations, allowing for performance measurement of each approach in a consistent manner. ### Libraries In this benchmark, no external libraries are utilized; instead, the native `Array` and `Set` data structures provided by JavaScript are used. ### Special JavaScript Features The benchmark predominantly leverages standard JavaScript features: - The `reduce` method is a built-in array function that allows for accumulation of values through a callback. - `for...of` is a loop construct introduced in ES6 (ECMAScript 2015) that iterates over iterable objects such as arrays, making it easier to work with collections. ### Alternatives Other alternatives for performance comparison could include: - **Traditional `for` Loop**: A classic approach that offers potentially better performance, especially in tight loops since there are fewer abstractions. - **`Array.prototype.forEach()`**: Similar to `reduce`, but designed for executing a function on each element without returning a value, not suitable for accumulating results but an option for iterating over arrays. In summary, this benchmark provides insight into performance differences between two common methods for processing arrays in JavaScript, showcasing the evolving approaches to coding in the language while maintaining core functionality.
Related benchmarks:
Array.reduce vs for loop vs Array.forEach vs for of loop
Array.reduce vs for loop vs Array.forEach vs for of loop
Array.reduce vs for loop vs Array.forEach -123
Array.reduce vs for loop vs Array.forEach vs for of loopv6
Array.reduce vs for loop vs Array.forEach for 500000 elements
Array.reduce vs for loop vs Array.forEach vs for...of
Array.reduce vs for loop vs Array.forEach 1
Array.reduce vs for loop vs Array.forEach vs Array.forIn
Array.reduce vs for loop vs Array.forEachaaaa
Comments
Confirm delete:
Do you really want to delete benchmark?