Benchmark: lodash clonedeep vs json.parse(stringify()) vs recursivecopy - ip-test

HTML Preparation code:

<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

var MyObject = {
  "default": true,
  "prefixWithTag": true,
  "useWrapperPrefix": true,
  "props": {
    "tag": "a",
    "className": [
      "h-w-100",
      "h-global-transition"
    ]
  },
  "label": "Button",
  "supports": {
    "styles": [
      "transition",
      "background",
      "border",
      "spacing",
      "typography",
      "misc"
    ],
    "states": [
      "normal",
      "hover",
      "focus"
    ],
    "filters": {
      "typography": {
      	doSMTH:()=>{}
      }
    }
  }
};

Tests:

Lodash CloneDeep
myCopy = _.cloneDeep(MyObject);
Json Clone
myCopy = JSON.parse(JSON.stringify(MyObject));

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash CloneDeep
Json Clone

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 7 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:142.0) Gecko/20100101 Firefox/142.0

Browser/OS: Firefox 142 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
Lodash CloneDeep	357516.7 Ops/sec
Json Clone	756592.6 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 7 months ago):

LLMs can make mistakes. Check important info.

The benchmark defined in the provided JSON tests the performance of three different methods for deep cloning an object in JavaScript. The approaches being compared are:

1. **Lodash `cloneDeep`**: This method uses the Lodash library to create a deep copy of an object.
2. **JSON Serialization**: This approach utilizes `JSON.stringify()` to convert the object to a JSON string and then `JSON.parse()` to convert that string back to a new object.
3. **Recursive Copy** (not explicitly mentioned in the provided test cases but indicated in the benchmark definition): This method would involve a custom recursive function that creates a deep copy of an object.

### Test Options Compared

- **Lodash `cloneDeep`**:
  - **Pros**:
    - Handles complex objects, including those with nested properties and arrays, more gracefully.
    - Manages circular references and is capable of cloning objects containing methods.
  - **Cons**:
    - Requires an external library (Lodash), which adds dependency overhead.
    - May have a larger memory footprint and slower execution time for simple objects compared to other methods.

- **JSON Serialization (`JSON.parse(JSON.stringify(MyObject))`)**:
  - **Pros**:
    - Simple to use, does not require additional libraries.
    - Generally performs well for standard objects that do not contain circular references.
  - **Cons**:
    - Cannot handle functions, `undefined` values, or special objects like `Date` or `Map`.
    - Throws an error if the object contains circular references.

### Considerations

When selecting a method for deep cloning, it's important to consider the nature of the objects being cloned. If the objects are simple and do not contain any special cases (functions, circular references, etc.), the JSON serialization method can be a quick and efficient solution. However, for more complex objects, using Lodash `cloneDeep` is advisable despite the performance cost.

### Benchmark Results

From the latest benchmark results:
- The JSON clone method executed approximately **310,888 times per second**.
- The Lodash clone method executed at about **229,169 times per second**.

The results indicate that the JSON serialization method is significantly faster than the Lodash method when cloning the specific `MyObject` defined for the tests.

### Alternatives

Other alternatives for deep cloning objects could include:

1. **Manual Recursion**: Implementing a custom deep clone function that addresses the specific needs of the data, which might afford the best performance optimization for specific use cases.
   
2. **Structured Clone**: The newer `structuredClone()` function in modern JavaScript allows you to clone complex data structures, including those with circular references, without the drawbacks of the JSON method.

3. **Using Libraries**: Other libraries like `rfdc` (Really Fast Deep Clone) or `immer` for immutable data structures can also be evaluated for deep cloning, each with its own performance characteristics and API.

Selecting the appropriate copying method is highly contextual and depends on the exact requirements of the application, data structures involved, and performance considerations specific to the use case.

Related benchmarks:

lodash clonedeep vs json.parse(stringify()) vs recursivecopy - ip-test (version: 1)

Comparing performance of: Lodash CloneDeep vs Json Clone

Created: 7 months ago by: Guest

Jump to the latest result

Lodash CloneDeep

Json Clone

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 7 months ago):