Benchmark: Lodash cloneDeep vs JSON.parse(JSON.stringify(obj))

HTML Preparation code:

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

Script Preparation code:

arr = [];
for (let i = 0; i < 200; i += 1) {
    arr.push({
      name: `Person${i}`,
      birthday: moment().add(i, 'days').toDate(),
    });
  }

Tests:

Lodash cloneDeep
const cloneArr = _.cloneDeep(arr);
Deep clone with JSON.parse(JSON.stringify(obj))
const cloneArr = JSON.parse(JSON.stringify(arr));

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Deep clone with JSON.parse(JSON.stringify(obj))

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 years ago)

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36

Browser/OS: Chrome 119 on Linux

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	4115.1 Ops/sec
Deep clone with JSON.parse(JSON.stringify(obj))	5739.2 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Let's dive into the explanation of the provided benchmark.

**Benchmark Overview**

The benchmark compares two approaches for creating a deep clone of an object: Lodash's `cloneDeep` function and using `JSON.parse(JSON.stringify(obj))`. The test creates an array of objects with nested properties, including dates, to simulate real-world data structures.

**Options Compared**

Two options are compared:

1. **Lodash cloneDeep**: This approach uses the `_.cloneDeep()` method from Lodash, a popular JavaScript utility library. It recursively clones the entire object graph, ensuring that all nested properties are also cloned.
2. **JSON.parse(JSON.stringify(obj))**: This approach uses the `JSON.parse()` method to convert the original object into a JSON string and then parses it back into an object using `JSON.parse()`. While this method can create a shallow clone, it's not suitable for deep cloning objects with complex nested structures.

**Pros and Cons**

**Lodash cloneDeep**

Pros:

* Recursively clones the entire object graph, ensuring that all nested properties are cloned.
* Handles circular references by keeping track of cloned objects.
* Is widely used and well-tested in the JavaScript community.

Cons:

* Adds an external dependency on Lodash.
* May have performance overhead due to the recursive cloning process.

**JSON.parse(JSON.stringify(obj))**

Pros: None.

Cons:

* Does not recursively clone object properties, making it unsuitable for deep cloning.
* Can create circular references if the original object contains a reference to itself.
* Is a straightforward implementation but lacks the robustness of Lodash's `cloneDeep`.

**Library: Lodash**

Lodash is a popular JavaScript utility library that provides various functions for tasks such as array manipulation, string iteration, and object cloning. The `cloneDeep()` function is specifically designed for deep cloning objects and has become a de facto standard in the JavaScript community.

**Special JS Feature or Syntax (None)**

There are no special JavaScript features or syntax used in this benchmark.

**Alternative Approaches**

Other approaches for creating deep clones of objects include:

1. Using the `Object.assign()` method with an empty object: `const cloneObj = Object.assign({}, originalObj);`
2. Implementing a custom recursive cloning function using a stack data structure.
3. Utilizing libraries like `js-yaml` or `deepclone` that provide similar functionality to Lodash's `cloneDeep`.

However, these approaches may have their own trade-offs and limitations, making the comparison between Lodash's `cloneDeep` and `JSON.parse(JSON.stringify(obj))` still relevant for understanding performance and code readability considerations.

Related benchmarks:

Lodash cloneDeep vs JSON.parse(JSON.stringify(obj)) (version: 0)

Comparing performance of: Lodash cloneDeep vs Deep clone with JSON.parse(JSON.stringify(obj))

Created: 5 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Deep clone with JSON.parse(JSON.stringify(obj))

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):