Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Create object
(version: 0)
Comparing performance of:
Spread vs Object.assign (mutate) vs Object.assign (new object)
Created:
7 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
var obj = {a: 'a', b: 'b'};
Tests:
Spread
const newObj = { ...obj, c: 'c'};
Object.assign (mutate)
const newObj = Object.assign(obj, { c: 'c' });
Object.assign (new object)
const newObj = Object.assign({}, obj, { c: 'c' });
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
Spread
Object.assign (mutate)
Object.assign (new object)
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):
I'd be happy to explain the benchmark and its results. **Benchmark Overview** The provided JSON represents a JavaScript microbenchmark, which is a small program designed to measure the performance of specific code snippets. In this case, we have three test cases that compare different ways of creating an object with additional properties. **Test Cases** 1. **Spread**: The first test case measures the performance of using the spread operator (`...`) to create a new object with merged properties. ```javascript const newObj = { ...obj, c: 'c' }; ``` 2. **Object.assign (mutate)**: The second test case measures the performance of using `Object.assign()` to mutate an existing object and add new properties. ```javascript const newObj = Object.assign(obj, { c: 'c' }); ``` 3. **Object.assign (new object)**: The third test case measures the performance of creating a new object using `Object.assign()` with an initial empty object (`{}`) and then merging it with the original object. ```javascript const newObj = Object.assign({}, obj, { c: 'c' }); ``` **Options Compared** The benchmark compares three different approaches to create an object with additional properties: 1. **Spread Operator**: Uses the spread operator (`...`) to merge properties from two objects. 2. **Object.assign() (mutate)**: Uses `Object.assign()` to mutate an existing object and add new properties. 3. **Object.assign() (new object)**: Creates a new object using `Object.assign()` with an initial empty object (`{}`) and then merging it with the original object. **Pros and Cons** Here's a brief summary of each approach: 1. **Spread Operator**: * Pros: Simple, efficient, and widely supported. * Cons: Only works for objects that can be spread (e.g., properties that are not functions or symbols). 2. **Object.assign() (mutate)**: * Pros: Can mutate existing objects and is generally faster than creating a new object. * Cons: May modify the original object if not intended, and its performance can vary depending on the browser's implementation. 3. **Object.assign() (new object)**: * Pros: Creates a new object without modifying the original one, which can be beneficial for security or readability reasons. * Cons: May be slower than using `Object.assign()` with an existing object. **Library and Special JS Feature** None of these test cases use any libraries or special JavaScript features. They only rely on built-in language constructs. **Other Alternatives** If you're looking for alternative ways to create objects with additional properties, some other approaches include: 1. **Object.create()**: Creates a new object with the given prototype. ```javascript const newObj = Object.create(obj); newObj.c = 'c'; ``` 2. **Array.prototype.push()** and **Object.assign()**: Use an array as the initial object and push new properties onto it using `push()` and then merge it with another object using `Object.assign()`. ```javascript const arr = []; arr.push('a'); arr.push('b'); newObj = Object.assign({}, obj, arr); ``` Note that these alternatives may have different performance characteristics or trade-offs depending on your specific use case. I hope this explanation helps you understand the benchmark and its results!
Related benchmarks:
Variable assignment from object | traditional vs destructuring
Object speard vs assign
object create vs others
Testytesty2
Object spread
Comments
Confirm delete:
Do you really want to delete benchmark?