Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
JavaScript spread operator vs Object.assign performance v3
(version: 0)
Comparing performance of:
Using the spread operator vs Using Object.assign
Created:
3 years ago
by:
Guest
Go to the latest result
Tests:
Using the spread operator
const secondObject = {sampleData: 'Hello world', moreData: 'foo bar' } const finalObject = { ...secondObject };
Using Object.assign
const secondObject = {sampleData: 'Hello world', moreData: 'foo bar' } const finalObject = Object.assign({}, secondObject);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Using the spread operator
Using Object.assign
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
11 months ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36
Browser/OS:
Chrome 140 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Using the spread operator
92.5M/s
Using Object.assign
38.3M/s
View exact numbers
Test name
Executions per second
✓
Using the spread operator
92,527,152 Ops/sec
Using Object.assign
38,335,196 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and its test cases. **Benchmark Overview** The benchmark, hosted on MeasureThat.net, is designed to compare the performance of two approaches for creating shallow copies of objects in JavaScript: using the spread operator (`...`) and `Object.assign()` with an empty object `{}`. **Test Cases** There are only two test cases: 1. **Using the Spread Operator** ```javascript const secondObject = { sampleData: 'Hello world', moreData: 'foo bar' } const finalObject = { ...secondObject } ``` This test case creates a shallow copy of `secondObject` using the spread operator (`...`). The resulting object, `finalObject`, will have the same properties as `secondObject`. 2. **Using Object.assign** ```javascript const secondObject = { sampleData: 'Hello world', moreData: 'foo bar' } const finalObject = Object.assign({}, secondObject) ``` This test case creates a shallow copy of `secondObject` using the `Object.assign()` method with an empty object `{}` as the target. **Options Compared** The benchmark is comparing two options: * Using the spread operator (`...`) * Using `Object.assign()` with an empty object `{}` **Pros and Cons** 1. **Using the Spread Operator** * Pros: + Simple and concise syntax + Works well for shallow objects * Cons: + Can be slower than other methods for very large objects (due to the overhead of creating a new array) 2. **Using Object.assign** * Pros: + Can be faster than the spread operator for very large objects * Cons: + Requires an empty object as the target, which can be unnecessary + Less intuitive syntax compared to the spread operator **Library Usage** Neither test case uses any external libraries. **Special JS Feature/Syntax** There is no specific JavaScript feature or syntax being tested in these benchmark cases. The focus is on comparing two simple approaches for creating shallow copies of objects. **Other Alternatives** If you need to create a deep copy of an object, the spread operator may not be sufficient. In such cases, you can use the `JSON.parse(JSON.stringify(object))` method or libraries like Lodash's `cloneDeep()` function. For more complex scenarios, you might consider using libraries like Object.assign() alternatives like `lodash.clone()` or `immediate-assign`. Keep in mind that these benchmarks are designed to compare simple approaches for shallow object copying. In real-world applications, you may encounter more complex use cases that require different solutions.
Related benchmarks
object assign vs object spread on growing objects
JavaScript spread operator vs Object.assign performance (single addition)
JavaScript spread operator vs Object.assign performance - Kien Nguyen
Object.assign() vs spread operator (New object)
Comments
Confirm delete:
Do you really want to delete benchmark?