Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
JavaScript spread operator vs Object.assign performance fixed 2
(version: 0)
Comparing performance of:
Using the spread operator vs Using Object.assign
Created:
3 years ago
by:
Guest
Go to the latest result
Script Preparation code:
var firstObject = { sampleData: 'Hello world' } var secondObject = { moreData: 'foo bar' }
Tests:
Using the spread operator
const finalObject = { ...firstObject, ...secondObject };
Using Object.assign
const finalObject = 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:
2 years ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36
Browser/OS:
Chrome 114 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Using Object.assign
7.4M/s
Using the spread operator
5.1M/s
View exact numbers
Test name
Executions per second
✓
Using Object.assign
7,391,320 Ops/sec
Using the spread operator
5,050,028 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down what's being tested in this benchmark. The provided JSON represents a JavaScript microbenchmarking test case, specifically comparing the performance of two approaches: using the spread operator (`...`) and `Object.assign()` to merge two objects into a single object. **Options Compared** The two options being compared are: 1. Using the spread operator (`...`): ```javascript const finalObject = { ...firstObject, ...secondObject }; ``` 2. Using `Object.assign()`: ```javascript const finalObject = Object.assign({}, firstObject, secondObject); ``` **Pros and Cons of Each Approach** 1. **Using the spread operator (`...`):** * Pros: + More concise and readable code. + Expresses intent clearly that two objects are being merged. * Cons: + May be slower due to the overhead of creating a new array-like object. 2. **Using `Object.assign()`:** * Pros: + Can be faster since it avoids creating a new array-like object. * Cons: + Requires more code and is less concise than using the spread operator. + May not express intent as clearly. **Other Considerations** Both approaches have trade-offs between readability, conciseness, and performance. In general, using the spread operator can make your code more readable and maintainable, but may incur a slight performance penalty. Using `Object.assign()` is more concise, but less readable and may be slower due to its overhead. **Library and Special JS Features** In this benchmark, no libraries or special JavaScript features are being used beyond what's built into the standard library. The spread operator was introduced in ECMAScript 2018 (ES2018) and `Object.assign()` has been available since ES5. **Alternatives** If you need to merge objects frequently, other alternatives include: 1. Using a library like Lodash (`_`.merge()) or Underscore.js (`_.extend()`) which provide more concise ways to merge objects. 2. Using the `Object.create()` method and then assigning properties to it: ```javascript const finalObject = Object.create(firstObject); finalObject.sampleData = 'Hello world'; finalObject.moreData = 'foo bar'; ``` However, these alternatives may not be as readable or maintainable as using the spread operator or `Object.assign()`.
Related benchmarks
JavaScript spread operator vs Object.assign performance v3
Comments
Confirm delete:
Do you really want to delete benchmark?