Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Push vs LHS spread
(version: 0)
Is it fast to build up an array using the spread operator on the left-hand side?
Comparing performance of:
Push vs Spread
Created:
4 years ago
by:
Guest
Go to the latest result
Tests:
Push
const arr = []; for (let i=0; i < 100; i++) { arr.push(i); }
Spread
let arr = []; for (let i=0; i < 100; i++) { arr = [...arr, i]; }
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Push
Spread
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one month ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/148.0.0.0 Safari/537.36
Browser/OS:
Chrome 148 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=629947" width="100%" height="500px"></iframe>
Push
6.0M/s
Spread
217K/s
View exact numbers
Test name
Executions per second
✓
Push
5,964,802 Ops/sec
Spread
216,824 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and explain what is being tested, compared, and analyzed. **Benchmark Definition** The benchmark definition is a JSON object that provides metadata about the test case: ```json { "Name": "Push vs LHS spread", "Description": "Is it fast to build up an array using the spread operator on the left-hand side?", "Script Preparation Code": null, "Html Preparation Code": null } ``` In essence, this benchmark compares two ways of creating arrays in JavaScript: 1. The traditional `push` method: `arr.push(i)`. 2. Using the spread operator (`...`) on the left-hand side: `arr = [...arr, i]`. **Test Cases** The test cases are individual scripts that implement each of these methods: ```javascript [ { "Benchmark Definition": "const arr = [];\r\nfor (let i=0; i < 100; i++) {\r\n arr.push(i);\r\n}", "Test Name": "Push" }, { "Benchmark Definition": "let arr = [];\r\nfor (let i=0; i < 100; i++) {\r\n arr = [...arr, i];\r\n}", "Test Name": "Spread" } ] ``` **Library Used** In both test cases, a library is used to create an array and perform the benchmark. However, since it's not explicitly mentioned in the JSON data, we can assume that `Array.prototype.push` and `Array.prototype.concat` are being used, which are part of the built-in JavaScript API. **Special JS Features or Syntax** The spread operator (`...`) is a new feature introduced in ECMAScript 2015 (ES6). It allows for creating a new array by spreading elements from an existing array. This syntax is not supported in older browsers like Chrome 102, which is running on Mac OS X 10.15.7. **Browser and Device Information** The latest benchmark results provide information about the browser, device platform, operating system, and execution frequency: ```json [ { "RawUAString": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36", "Browser": "Chrome 102", "DevicePlatform": "Desktop", "OperatingSystem": "Mac OS X 10.15.7", "ExecutionsPerSecond": 4749822.5, "TestName": "Push" }, { "RawUAString": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36", "Browser": "Chrome 102", "DevicePlatform": "Desktop", "OperatingSystem": "Mac OS X 10.15.7", "ExecutionsPerSecond": 167176.53125, "TestName": "Spread" } ] ``` The execution frequency is higher for the `Push` method, suggesting that it might be faster. **Other Alternatives** If you're interested in exploring alternative approaches to this benchmark, here are a few options: 1. Using `Array.prototype.slice()` instead of `push`: This method returns a new array with copies of elements from the original array. 2. Using a library like Lodash or Ramda for array manipulation: These libraries provide various functions for creating and manipulating arrays. 3. Implementing a custom array creation function using bitwise operations or other optimization techniques. Keep in mind that these alternatives might not be as straightforward to implement as the `push` and spread operator methods, but they could potentially offer performance benefits in specific scenarios.
Related benchmarks
Array.push vs Spread operator
Comments
Confirm delete:
Do you really want to delete benchmark?