Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Object.assign vs Object spread vs object assign
(version: 0)
Comparing performance of:
Object.assign vs spread operator vs object assign
Created:
5 years ago
by:
Guest
Jump to the latest result
Tests:
Object.assign
var params = { b:"hello", c: true, d:7 }; var other = Object.assign(params, { d: 2 });
spread operator
var params = { b:"hello", c: true, d:7 }; var other = { ...params, d: 2 };
object assign
var params = { b:"hello", c: true, d:7 }; params.d = 2; var other = params;
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
Object.assign
spread operator
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):
Let's break down what is tested in the provided benchmark. **Benchmark Definition** The benchmark tests three different approaches to assign values to an object: 1. `Object.assign()`: This method takes two or more objects as arguments and returns a new object that contains all the properties from each argument. It modifies the original objects by adding, updating, or creating new properties. 2. **Spread Operator (`...`)**: This operator is used to create a new object with the same keys as another object, but with the values spread out into separate key-value pairs. For example, `{ ...params, d: 2 }` creates a new object that takes all the properties from `params` and adds a new property `d` with value `2`. 3. **Object Assign (`params.d = 2; var other = params;`)**: This approach uses direct assignment to modify an existing object and then creates a new variable `other` that references the modified object. **Options Compared** The benchmark compares these three approaches in terms of their performance, which is measured by the number of executions per second on a specific browser and device platform. **Pros and Cons** Here are some pros and cons for each approach: 1. **Object.assign()** * Pros: Easy to use, straightforward syntax. * Cons: Can be slower than other approaches due to the overhead of creating a new object and merging properties. 2. **Spread Operator (`...`)**: * Pros: Concise syntax, can be faster than `Object.assign()` for large objects. * Cons: Requires understanding of spread operator syntax and may not be supported in older browsers or environments. 3. **Object Assign (`params.d = 2; var other = params;`)**: * Pros: May be the fastest approach due to direct assignment, but can be confusing to read and understand. * Cons: Less readable than other approaches, can lead to unintended side effects if not used carefully. **Library Usage** The benchmark does not explicitly use any external libraries, but it relies on built-in JavaScript features like `Object.assign()` and the spread operator (`...`). **Special JS Feature/Syntax** The benchmark uses the spread operator (`...`) syntax, which is a relatively modern feature introduced in ECMAScript 2018 (ES2018). While this syntax is widely supported, some older browsers or environments may not support it. In summary, the benchmark provides a neutral evaluation of three different approaches to assign values to an object, highlighting their pros and cons. It also touches on the use of the spread operator (`...`) syntax, which requires understanding of modern JavaScript features.
Related benchmarks:
Spread vs Object.assign (modify ) vs Object.assign (new)
object.assign vs spread to create a copy
object spread vs Object.assign
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?