Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
Add new element to array: unshift vs destructuring
(version: 0)
Benchmark.js
Comparing performance of:
Spread vs Unshift
Created:
3 years ago
by:
Guest
Go to the latest result
Tests:
Spread
var params = [ "hello", true, 7 ] var other = [ 'new', ...params ]
Unshift
var params = [ "hello", true, 7 ]; params.unshift('new');
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Spread
Unshift
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
11 months ago
)
User agent:
Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36
Browser/OS:
Chrome 137 on Linux
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=619005" width="100%" height="500px"></iframe>
Spread
42.7M/s
Unshift
13.8M/s
View exact numbers
Test name
Executions per second
✓
Spread
42,682,628 Ops/sec
Unshift
13,830,481 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and explain what's being tested, compared, and analyzed. **Benchmark Overview** The benchmark compares two approaches for adding a new element to an array: using the `unshift` method versus destructuring with the spread operator (`...`). **Options Compared** There are two options being compared: 1. **Unshift**: This is a built-in JavaScript method that adds one or more elements to the beginning of an array. 2. **Destructuring with Spread Operator (`...`)**: This approach uses the spread operator to create a new array by copying elements from the original array and adding a new element. **Pros and Cons** * **Unshift**: + Pros: Simple and straightforward, easy to read and write. + Cons: Can be slower than destructuring with the spread operator for large arrays. * **Destructuring with Spread Operator (`...`)**: + Pros: Generally faster than `unshift` for large arrays, more concise and expressive code. + Cons: Requires modern JavaScript features (ES6+) and can be less readable for some developers. **Library/Tool Used** There doesn't appear to be any specific library or tool being used in this benchmark. However, the use of the spread operator (`...`) requires modern JavaScript features, which is not a library per se but rather a feature of the JavaScript language. **Special JS Feature/Syntax** The use of the spread operator (`...`) and destructuring are examples of modern JavaScript features introduced with ES6+. These features provide concise and expressive ways to create new arrays and objects from existing ones. **Other Considerations** * **Array Performance**: The performance difference between `unshift` and destructuring with the spread operator can be significant for large arrays. In this benchmark, the raw execution time is provided, but actual performance may vary depending on specific use cases. * **Code Readability**: While `unshift` is simple and easy to read, destructuring with the spread operator can make code more concise and expressive. However, readability also depends on individual developer preferences. **Other Alternatives** If you were to replace this benchmark with alternative approaches, some options could be: 1. Using `concat()`: This method creates a new array by copying elements from an existing array and adding one or more elements. 2. Using `Array.prototype.push()` followed by `shift()`: This approach adds a new element to the end of the array using `push()`, then removes the last element using `shift()`. 3. Using a custom implementation: Depending on your specific requirements, you might consider implementing an optimized custom algorithm for adding elements to arrays. Keep in mind that the choice of alternative approaches depends on your specific use case and performance requirements.
Related benchmarks
Splice vs Spread vs Unshift to insert at beginning of array
Splice vs Spread vs Unshift to insert at beginning of array (fixed from slice)
Add new element to array - unshift vs destructuring
Comments
Confirm delete:
Do you really want to delete benchmark?