Benchmark: Lodash cloneDeep vs JSON Clone vs structuredClone

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 = {
  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...'
  },
  abc: {
    test: [1, 2, 3],
    other: []
  }
};

var myCopy = null;

Tests:

Lodash cloneDeep
myCopy = _.cloneDeep(MyObject);
Json clone
myCopy = JSON.parse(JSON.stringify(MyObject));
structuredClone
myCopy = structuredClone(MyObject);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Json clone
structuredClone

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:99.0) Gecko/20100101 Firefox/99.0

Browser/OS: Firefox 99 on Windows

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	237073.6 Ops/sec
Json clone	318683.0 Ops/sec
structuredClone	288438.0 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 6 months ago):

LLMs can make mistakes. Check important info.

Let's break down the benchmark and its test cases.

**Benchmark Overview**

The benchmark measures the performance of three different methods to create a deep copy of an object: `_.cloneDeep` from Lodash, `JSON.parse(JSON.stringify())`, and `structuredClone`. The test case uses a sample object `MyObject` with various properties, including nested objects and arrays.

**Test Cases**

1. **Lodash cloneDeep**: This method creates a deep copy of the input object using the `_.cloneDeep()` function from Lodash.
2. **JSON Clone**: This method uses the `JSON.parse(JSON.stringify())` trick to create a deep copy of the input object. This approach converts the object to a JSON string, then parses it back into an object.
3. **structuredClone**: This is a more modern method introduced in ECMAScript 2022, which creates a deep copy of the input object using the `structuredClone()` function.

**Pros and Cons**

* **Lodash cloneDeep**:
	+ Pros: Efficient and well-tested implementation from a popular library.
	+ Cons: Requires an additional dependency (Lodash) and may not be as lightweight as other options.
* **JSON Clone**:
	+ Pros: Lightweight and doesn't require any additional dependencies.
	+ Cons: May not work correctly with all types of objects or arrays, especially those containing functions, undefined values, or non-serializable properties.
* **structuredClone**:
	+ Pros: Modern, lightweight, and efficient implementation specifically designed for deep copying objects.
	+ Cons: Requires ECMAScript 2022 support (not widely adopted yet) and may not be as well-tested as Lodash's implementation.

**Library and Features**

* **Lodash**: A popular JavaScript library that provides a wide range of utility functions, including `cloneDeep()`. It's widely used and well-maintained.
* **structuredClone**: Introduced in ECMAScript 2022, this function is specifically designed for deep copying objects. It's still relatively new, but it offers an efficient and lightweight implementation.

**Special JS Features or Syntax**

None mentioned explicitly in the benchmark, but note that `structuredClone()` relies on the `Structured Clone` proposal, which is still a work in progress. If you're interested in exploring this feature further, I can provide more information!

**Other Alternatives**

If you're not using Lodash or want to explore other options, here are some additional deep copying methods:

* **Array.prototype.slice() + JSON.parse(JSON.stringify())**: This approach creates a shallow copy of the input array and then recursively clones its elements.
* **JSON.stringify() + eval()**: This approach converts the object to a JSON string, then uses `eval()` to create a new object from the string. Be cautious with this method as it can lead to security issues if used incorrectly.

Keep in mind that these alternatives may not be as efficient or reliable as Lodash's implementation or `structuredClone()`.

Related benchmarks:

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

Comparing performance of: Lodash cloneDeep vs Json clone vs structuredClone

Created: 3 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Json clone

structuredClone

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 6 months ago):