Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Object set vs new spread when reducing over results
(version: 0)
Compare the new ES6 spread operator with the traditional concat() method and push
Comparing performance of:
Set vs Spread
Created:
2 years ago
by:
Guest
Jump to the latest result
Tests:
Set
Array(10000).fill(1).reduce((acc, i, indx) => {acc[indx] = i; return acc;}, {});
Spread
Array(10000).fill(1).reduce((acc, i, indx) => {return {...acc, [indx]: i}}, {});
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Set
Spread
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36
Browser/OS:
Chrome 120 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
Set
13852.5 Ops/sec
Spread
100.9 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 Definition** The provided JSON represents a benchmark definition for comparing two approaches to reducing an array: using `concat()` with `push` versus the new ES6 spread operator (`...`). The benchmark aims to measure which approach is faster and more efficient. **Options Compared** Two options are being compared: 1. **Traditional concat() method and push**: This approach uses the `Array.prototype.concat()` method, which creates a new array by copying elements from an existing array, followed by assigning each element of the original array using the `push()` method. 2. **New ES6 spread operator (`...`)**: This approach uses the spread operator to create a new object with key-value pairs from the original array. **Pros and Cons** * **Traditional concat() method and push**: + Pros: Widely supported, easy to understand, and has been used for a long time. + Cons: Can be slow due to the overhead of creating a new array and iterating over the elements. * **New ES6 spread operator (`...`)**: + Pros: Faster, more efficient, and concise. It's also widely supported in modern browsers and Node.js versions. + Cons: May require a good understanding of the syntax, and its performance can vary depending on the browser or environment. **Library Used** In this benchmark, no specific library is used. The focus is solely on comparing two JavaScript built-in methods. **Special JS Feature/Syntax** The ES6 spread operator (`...`) is being tested. This feature was introduced in ECMAScript 2015 and allows for concise object creation from arrays or other iterables. **Other Alternatives** Before settling on these two approaches, developers might consider alternative methods: * Using `Array.prototype.reduce()` without the spread operator to create a new array. * Utilizing `Array.prototype.map()` followed by `Object.fromEntries()` to transform the array into an object. * Leveraging libraries like Lodash or Underscore.js for array manipulation. **Benchmark Preparation Code** The provided JSON does not include any script preparation code, suggesting that the benchmark is focused on measuring the performance difference between these two approaches in a vanilla JavaScript environment.
Related benchmarks:
spread operator vs push
Array concat vs spread operator vs push larger list
zk test spread vs push
Array push vs spread when reducing over results
Comments
Confirm delete:
Do you really want to delete benchmark?