Benchmark: Deep copies - MeasureThat.net

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

let source ={
  "surname": "Rossi",
  "name": "Mario",
  "cfPiva": "RSSMRA80A01H501Z",
  "plate": "AB123CD",
  "birthDate": "1980-01-01",
  "proviceBirth": "Roma",
  "cityBirth": "Roma",
  "proviceResidence": "Roma",
  "cityResidence": "Roma",
  "company": "XYZ Srl",
  "mainRole": "Amministratore",
  "roles": "Direttore, Manager",
  "injuries": "Nessuno"
};

Tests:

using json
const toSend = JSON.parse(JSON.stringify(source));
... operator
const toSend = { ...source };
Object.assign
const toSend = Object.assign({}, source);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
using json
... operator
Object.assign

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 14 days ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
using json	573588.7 Ops/sec
... operator	27227894.0 Ops/sec
Object.assign	2868758.0 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 14 days ago):

LLMs can make mistakes. Check important info.

The benchmark defined in the provided JSON tests various methods of creating a deep copy of a JavaScript object named `source`. A deep copy means creating a new object that is a complete copy of the original, including all nested properties. This is crucial when you want to manipulate the copied object without affecting the original.

### Benchmark Methods Compared

1. **Using JSON**
   - **Code**: `const toSend = JSON.parse(JSON.stringify(source));`
   - **Description**: This approach serializes the source object to a JSON string and then parses it back into a new object. This method effectively creates a deep copy.
   - **Pros**:
     - Simple and easy to understand.
     - Works well for plain objects that only contain serializable data (no functions, special objects like Date, Map, Set, or undefined values).
   - **Cons**:
     - Not suitable for objects that contain non-serializable values, as they will be lost during serialization.
     - Performance can be poor with large objects due to the overhead of converting to a string and then back to an object.
   
2. **Spread Operator**
   - **Code**: `const toSend = { ...source };`
   - **Description**: The spread operator (`...`) creates a shallow copy of the object. While this is efficient for copying top-level properties, it does not create a deep copy for nested objects.
   - **Pros**:
     - Very concise and syntactically cleaner.
     - Fast for shallow copying.
   - **Cons**:
     - Only creates a shallow copy; nested objects will still reference the same objects in memory as the original.
     - Can lead to unintended side effects if nested structures are modified.

3. **Object.assign**
   - **Code**: `const toSend = Object.assign({}, source);`
   - **Description**: This method copies all enumerable own properties from the source object to a new target object, also creating a shallow copy.
   - **Pros**:
     - Works well for shallow copying and is compatible with older browsers.
     - Slightly more explicit than the spread operator, which can make it easier to understand for some developers.
   - **Cons**:
     - Like the spread operator, it does not create a deep copy, which can lead to the same issues with nested objects.
     - May require additional steps if a deep copy is necessary.

### Benchmark Results Overview

The benchmark provided results demonstrate the performance of each deep copy method when executed multiple times per second within a specific browser environment (Chrome 131 on Windows).

- **Spread Operator**: 
  - **Executions Per Second**: 27,227,894 
  - This method performed the best among the three, indicating both speed and efficiency in creating copies.
  
- **Object.assign**: 
  - **Executions Per Second**: 2,868,758 
  - This method had moderate performance but still significantly lower than the spread operator.

- **Using JSON**: 
  - **Executions Per Second**: 573,588.69 
  - This method was the slowest, which is expected due to the overhead of serializing and deserializing the object.

### Other Considerations

- **Deep Copy Alternatives**: 
  - Libraries like **Lodash** offer utility functions like `_.cloneDeep()` which handle deep copying effectively, and can manage complex cases that involve circular references or special value types. While they add some overhead, they simplify dealing with such scenarios.
  
- **Manual Deep Copy**: 
  - For complete control, especially when dealing with complex objects, developers may choose to recursively copy properties. This approach allows them to cater to specific needs but can be expensive in terms of development time and prone to errors.

In conclusion, choosing the right method for deep copying depends on the specific requirements of the application, including the complexity of the object structure, performance needs, and reliance on external libraries. The spread operator stands out for its combination of simplicity and speed, whereas the JSON method, while powerful for its simplicity, is constrained by its limitations on data types.

Related benchmarks:

Deep copies (version: 1)

Comparing performance of: using json vs ... operator vs Object.assign

Created: 14 days ago by: Guest

Jump to the latest result

using json

... operator

Object.assign

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 14 days ago):