Benchmark: Lodash cloneDeep vs JSON Clone (Big)

HTML Preparation code:

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

Script Preparation code:

var MyObject = {
  description: 'Creates a deep copy of source, which should be an object or an array.',
  myNumber: 123456789,
  myBoolean: true,
  jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...',
    selectors: ['.sada', 'asdgqa', '.sada', 'asdgqa', '.sada', 'asdgqa'],
    selectors2: ['.sada', 'asdgqa', '.sada', 'asdgqa', '.sada', 'asdgqa'],
    selectors3: ['.sada', '.sadsafasa', 'asdasdasf', '.sasdasdasada', 'asdasdasdasdasd', '.sasdasdasada', 'asdasdasdasdasd'],
    test: 221323,
    selectors4: ['.sada', '.sadsafasa', 'asdasdasf', {myNumber: 123456789, myBoolean: true}, 'asdasdasdasdasd', '.sasdasdasada', 213214],
    selectors5: ['.sada', '.sadsafasa', 'asdasdasf', {myNumber: 123456789, myBoolean: true}, 'asdasdasdasdasd', '.sasdasdasada', 213214]
  }
};

var myCopy = null;

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:

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):

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what's being tested, compared, and its pros and cons.

**Benchmark Definition**

The benchmark is testing two approaches to create a deep copy of an object: `_.cloneDeep` from Lodash and the built-in `JSON.parse(JSON.stringify())` method.

**Script Preparation Code**

The script prepares an object `MyObject` with various properties, including nested objects, arrays, and JavaScript values. This object serves as the input for both benchmarking methods.

**Html Preparation Code**

The HTML code includes a reference to Lodash 4.17.10 via a CDN, which is used by the first benchmarking method (`_.cloneDeep`).

**Individual Test Cases**

There are two test cases:

1. **Lodash cloneDeep**: Creates a deep copy of `MyObject` using `_.cloneDeep`.
2. **Json clone**: Creates a deep copy of `MyObject` using `JSON.parse(JSON.stringify())`.

**What's being tested?**

The benchmark is testing the performance difference between these two approaches:

* `_._cloneDeep`: A function from Lodash that creates a deep copy of an object, preserving all its properties and recursively copying nested objects.
* `JSON.parse(JSON.stringify())`: A built-in JavaScript method that converts a JavaScript value to a JSON string and then parses it back into a JavaScript object, creating a shallow copy.

**Comparison**

Here's a brief comparison of the two approaches:

* **_.cloneDeep**: Pros:
	+ More accurate, as it preserves all properties and recursively copies nested objects.
	+ Can handle complex data structures, such as arrays with objects or functions.
* `JSON.parse(JSON.stringify())`: Pros:
	+ Faster, as it leverages the optimized implementation of JSON parsing in modern browsers.
	+ Simplistic, as it only creates a shallow copy.

Cons:

* `_._cloneDeep` may consume more memory due to its recursive copying mechanism.
* `JSON.parse(JSON.stringify())` can fail if the input data contains circular references or non-serializable values.

**Special considerations**

This benchmark doesn't seem to test any special JavaScript features or syntax. However, it's worth noting that Lodash is a popular library used by many developers, and its implementation might affect performance compared to the built-in `JSON.parse(JSON.stringify())` method.

**Other alternatives**

If you're interested in exploring other approaches, here are some alternatives:

* **_.mergeDeep()`: Another function from Lodash that merges two objects together, preserving all properties. While it's not a direct copy, it can be used to create a deep merge of objects.
* **Object.assign()**: A method on the `Object` prototype that creates a new object by copying all enumerable own properties from an existing object.
* **for...in loops**: You could implement a custom loop-based approach to create a deep copy, but this would likely be slower and more error-prone than using libraries like Lodash.

In conclusion, this benchmark is testing the performance difference between two common approaches to creating deep copies of objects in JavaScript: `_.cloneDeep` from Lodash and the built-in `JSON.parse(JSON.stringify())` method.

Related benchmarks:

Lodash cloneDeep vs JSON Clone (Big) (version: 0)

Comparing performance of: Lodash cloneDeep vs Json clone

Created: 7 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Json clone

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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