Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
JavaScript spread operator vs Object.assign performance without mutating original object
(version: 0)
Comparing performance of:
Using the spread operator vs Using Object.assign
Created:
5 years ago
by:
Guest
Jump to the latest result
Tests:
Using the spread operator
const firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } const finalObject = { ...firstObject, ...secondObject };
Using Object.assign
const firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } 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:
No previous run results
This benchmark does not have any results yet. Be the first one
to run it!
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
**What is being tested?** MeasureThat.net is testing the performance of two approaches to merge objects in JavaScript: 1. **Spread Operator (`...`)**: This syntax allows you to expand an object's properties into another object. 2. **Object.assign()**: This method copies all enumerable own properties from one or more source objects to a target object. The benchmark compares the performance of these two approaches when merging two objects without mutating the original objects. **Options being compared** * Using the spread operator (`...`) for object merging * Using `Object.assign()` for object merging **Pros and Cons of each approach:** **Using the Spread Operator (`...`)** Pros: * More concise and readable code * No need to specify the target object or existing properties * Efficient in modern JavaScript engines Cons: * Requires support for modern JavaScript features (introduced in ECMAScript 2018) * May not work as expected if the source objects have non-enumerable properties **Using Object.assign()** Pros: * Widespread support across older browsers and versions of Node.js * Can handle non-enumerable properties more accurately than the spread operator * Works with any JavaScript engine, including older ones Cons: * Less concise and readable code compared to the spread operator * Requires specifying the target object or existing properties **Other considerations** * **Library usage**: There is no library mentioned in the benchmark definition. However, `Object.assign()` has been a built-in method of the global `Object` since ECMAScript 5 (2009), so it doesn't require any external libraries. **Special JS feature or syntax** None are explicitly mentioned in this benchmark. However, the spread operator (`...`) was introduced in ECMAScript 2018 and might not work correctly in older JavaScript engines. **Other alternatives** If you prefer a different approach to object merging, here are some alternative methods: * **Object.create()**: This method creates a new object with the given prototype. You can then assign properties to it using `Object.assign()` or other means. * **JSON merge algorithms**: There are various JSON merge algorithms available, such as Lodash's `merge()` function or a custom implementation. Keep in mind that these alternatives might have different performance characteristics compared to the spread operator and `Object.assign()`.
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)
JavaScript spread operator vs Object.assign performance test number 99
Comments
Confirm delete:
Do you really want to delete benchmark?