Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
JavaScript spread operator vs Object.assign performance - modify object
(version: 0)
Comparing performance of:
Using the spread operator vs Using Object.assign
Created:
2 years ago
by:
Guest
Jump to the latest result
Tests:
Using the spread operator
const firstObject = { attempts: 1, created_at: 1694778031091, expires_at: 1694778091091, source: { externalId: "831f76fc-5a9d-49bc-8d4b-114010cedb73", name: "Tengen Uzui", type: "phone", }, type: "phone", value: "411273", }; const finalObject = { ...firstObject, attempts: firstObject.attempts + 1, };
Using Object.assign
const firstObject = { attempts: 1, created_at: 1694778031091, expires_at: 1694778091091, source: { externalId: "831f76fc-5a9d-49bc-8d4b-114010cedb73", name: "Tengen Uzui", type: "phone", }, type: "phone", value: "411273", }; const finalObject = Object.assign({}, firstObject, { attempts: firstObject.attempts + 1, });
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):
Let's break down the benchmark and explain what's being tested. **Benchmark Overview** The benchmark compares the performance of two approaches to modify an object: using the spread operator (`...`) and `Object.assign()`. The test creates an initial object, modifies it, and measures the execution time. **Options Compared** There are two options compared: 1. **Using the spread operator (`...`)**: This approach uses the spread operator to create a new object by copying the properties of the original object. 2. **Using `Object.assign()`**: This approach uses the `Object.assign()` method to copy the properties of the original object into a new object. **Pros and Cons** * **Using the spread operator (`...`)**: + Pros: concise, readable code, and often faster due to its inherent efficiency. + Cons: may not work as expected if the source object is modified concurrently. * **Using `Object.assign()`**: + Pros: widely supported, well-documented, and can handle complex objects with nested structures. + Cons: may be slower due to its method call overhead. **Library and Purpose** In both test cases, no libraries are used explicitly. However, it's worth noting that modern JavaScript environments (e.g., browsers) often include various built-in functions like `Object.assign()`. **Special JS Features or Syntax** There is no special JavaScript feature or syntax being tested in this benchmark. Both approaches use standard JavaScript features. **Other Considerations** When choosing between these two approaches, consider the following: * Code readability: If you prioritize concise code and don't mind using a more modern syntax, the spread operator might be a better choice. * Performance: In general, the spread operator is faster due to its inherent efficiency. However, this difference may not be significant in all cases. * Complexity: If your object has complex nested structures or if concurrent modifications are possible, `Object.assign()` might be a safer choice. **Alternatives** Other alternatives for modifying objects include: * Using the `Object.assign()` method with an empty object (`{}`) as the destination object: `const finalObject = Object.assign({}, firstObject, { attempts: firstObject.attempts + 1 });` * Using a library like Lodash's `cloneDeep()` function to create a deep copy of the original object. * Implementing your own custom cloning function using recursion or iteration. Keep in mind that these alternatives may have their own pros and cons, depending on the specific use case.
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?