Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Object.assign vs ES 6 Spread, multiple use cases
(version: 0)
Comparing performance of:
ES 6 Spread, combining objects vs Object.assign, combining objects vs ES 6 Spread, cloning objects vs Object.assign, cloning objects
Created:
3 years ago
by:
Guest
Jump to the latest result
Tests:
ES 6 Spread, combining objects
const a = { b: 'c', d: 'e', f: 'g' } const b = { c: 'd', e: 'f', g: 'h' } const c = { ...a, ...b }
Object.assign, combining objects
const a = { b: 'c', d: 'e', f: 'g' } const b = { c: 'd', e: 'f', g: 'h' } const c = Object.assign({}, a, b)
ES 6 Spread, cloning objects
const a = { b: 'c', d: 'e', f: 'g', g: 'h', i: 'j', j: 'k' } const b = { ...a }
Object.assign, cloning objects
const a = { b: 'c', d: 'e', f: 'g', g: 'h', i: 'j', j: 'k' } const b = Object.assign({}, a)
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
ES 6 Spread, combining objects
Object.assign, combining objects
ES 6 Spread, cloning objects
Object.assign, cloning objects
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 the benchmark and its test cases. **Benchmark Purpose:** The benchmark compares the performance of two approaches for merging or cloning objects in JavaScript: 1. Using the `Object.assign` method with an initial object (i.e., creating a shallow copy). 2. Using the spread operator (`...`) to merge or clone objects. **Options Compared:** * **ES 6 Spread**: This approach uses the spread operator to create a new object by merging or cloning existing objects. * **Object.assign**: This approach uses the `Object.assign` method to merge two objects into a new one, or to create a shallow copy of an object. **Pros and Cons:** * **ES 6 Spread**: + Pros: Generally faster, more concise, and easier to read. It also provides a way to merge objects in a single line. + Cons: Not all browsers support the spread operator (see browser compatibility), and it might not work as expected if the objects are very large or complex. * **Object.assign**: + Pros: Widely supported across most modern browsers, and it's a well-established method for merging objects. It also provides more control over the merge process through options. + Cons: Can be slower than the spread operator in some cases, and it requires multiple lines of code. **Library Used (if any):** None explicitly mentioned in this benchmark. **Special JS Features or Syntax:** The benchmark uses ES 6 features, specifically: * The spread operator (`...`) * Object destructuring (`const b = { ...a }`) These features are widely supported in modern JavaScript engines and are used to simplify the code and make it more concise. **Other Alternatives:** If you're looking for alternative approaches for merging or cloning objects, consider using: * `JSON.parse(JSON.stringify(obj))`: This method creates a deep copy of an object by serializing it as JSON and then parsing the resulting string back into an object. * `lodash.merge()`: If you need more complex merge logic or want to handle edge cases, you can use a library like Lodash that provides a robust implementation of merging objects. However, keep in mind that these alternatives might not be as concise or performant as the ES 6 spread operator and Object.assign methods.
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?