Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
JavaScript spread operator vs Object.assign performance reassign same variable 2
(version: 0)
Benchmark.js
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
let firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } const v = {...firstObject, ...secondObject}
Using Object.assign
const firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } const v = Object.assign({}, firstObject, 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:
one year ago
)
User agent:
Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:132.0) Gecko/20100101 Firefox/132.0
Browser/OS:
Firefox 132 on Ubuntu
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=570450" width="100%" height="500px"></iframe>
Using Object.assign
19.8M/s
Using the spread operator
10.5M/s
View exact numbers
Test name
Executions per second
✓
Using Object.assign
19,751,430 Ops/sec
Using the spread operator
10,524,940 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down what's being tested in this benchmark. **Benchmark Definition:** The benchmark is designed to compare the performance of two different ways of combining objects in JavaScript: 1. Using the spread operator (`...`). 2. Using `Object.assign()` with an initial empty object as the target (`Object.assign({}, ...)`). **Options compared:** We have two options being compared: * Option A: Using the spread operator (`...`) to combine two objects into a new object. + **Pros:** More concise and readable syntax, works well for simple cases where both objects are small. + **Cons:** May create intermediate objects in memory, which can be expensive if dealing with very large objects or datasets. * Option B: Using `Object.assign()` to combine two objects into a new object. + **Pros:** Avoids creating intermediate objects in memory, can be more efficient for large datasets. + **Cons:** More verbose syntax, may not be as readable. **Library and special JS feature used:** None of the options mentioned above require any external libraries or use special JavaScript features. The spread operator is a built-in language feature introduced in ECMAScript 2018 (ES2018), while `Object.assign()` has been part of the language since ES5. **Test case context:** The test case seems to be focused on comparing the performance of these two options when combining objects with similar structure and size. The use of an empty object as the initial target for `Object.assign()` ensures that we're only dealing with simple data, which makes it a good candidate for benchmarking. **Other alternatives:** Some other ways to combine objects in JavaScript include: * Using array methods like `concat()` or `reduce()` * Creating a new object using an object literal and then assigning values from the source objects * Using libraries like Lodash's `merge()` function However, these alternatives might introduce additional complexity and are not being tested here. I hope this explanation helps software engineers understand what's being tested in this benchmark!
Related benchmarks
object assign vs object spread on growing objects
JavaScript spread operator vs Object.assign performance - Kien Nguyen
Object.assign() vs spread operator (New object)
JavaScript spread operator vs Object.assign performance v3
Comments
Confirm delete:
Do you really want to delete benchmark?