Benchmark: Lodash cloneDeep vs structuredClone vs Json.stringify

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...'
  }
};

var myCopy = null;

Tests:

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

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
structuredClone
Json.stringify

Fastest: N/A

Slowest: N/A

Autogenerated LLM Sumamry (model llama3.2:3b, generated 2 days ago):

LLMs can make mistakes. Check important info.

Let's dive into the provided benchmark and explain what's being tested, compared, and some pros/cons of different approaches.

**What is being tested?**

The benchmark measures the performance of three different methods to create a deep copy of an object:

1. `structuredClone` (a built-in JavaScript method introduced in ES6)
2. `JSON.stringify` with `JSON.parse`
3. `lodash.cloneDeep`

These methods are compared for their execution speed.

**What options are compared?**

The benchmark compares the performance of each method on a specific input object, which includes nested properties and arrays. The test case uses an object `MyObject` with multiple properties, including a nested object `jayson`.

Here's a brief overview of each method:

* `structuredClone`: This method creates a deep copy of an object by recursively traversing its properties and creating new objects for each property. It's a more modern approach compared to the other two methods.
* `JSON.stringify` with `JSON.parse`: This method uses the `JSON.stringify` function to convert the input object to a JSON string, which is then parsed back into an object using `JSON.parse`. While this method creates a deep copy, it can be slower and more memory-intensive than the other two methods.
* `lodash.cloneDeep`: This method is a utility function from the Lodash library that creates a deep copy of an object. It's designed to be fast and efficient.

**Pros/Cons of each approach:**

* `structuredClone`:
	+ Pros: Modern, efficient, and memory-safe.
	+ Cons: Requires ES6 support (may not work in older browsers).
* `JSON.stringify` with `JSON.parse`:
	+ Pros: Widely supported across browsers, but can be slower and more memory-intensive.
	+ Cons: May introduce additional overhead due to stringification and parsing.
* `lodash.cloneDeep`:
	+ Pros: Fast, efficient, and widely supported (works in most modern browsers).
	+ Cons: Requires Lodash library inclusion.

**Library usage**

The benchmark uses the Lodash library for its `cloneDeep` method. Lodash is a popular utility library that provides various functions for tasks such as array manipulation, object creation, and more.

**Special JavaScript features or syntax**

None are mentioned in this specific benchmark.

**Other alternatives**

If you're interested in exploring alternative methods, here are a few:

* `Object.assign`: Creates a new object with properties from an existing object.
* `Array.prototype.map` + `Array.prototype.slice`: Can be used to create a deep copy of arrays by mapping over the original array and slicing the resulting array.
* `JSON.parse(JSON.stringify(obj))`: This method is similar to using `structuredClone`, but it may introduce additional overhead due to stringification and parsing.

Keep in mind that these alternatives might not provide the same level of performance as the benchmark's chosen methods, especially for large objects or arrays.

Latest run results:

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

User agent: Mozilla/5.0 (iPhone; CPU iPhone OS 16_1_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.1 Mobile/15E148 Safari/604.1

Browser/OS: Mobile Safari 16 on iOS 16.1.1

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	694459.3 Ops/sec
structuredClone	512850.9 Ops/sec
Json.stringify	769080.7 Ops/sec

Related benchmarks:

Lodash cloneDeep vs structuredClone vs Json.stringify (version: 0)

Comparing performance of: Lodash cloneDeep vs structuredClone vs Json.stringify

Created: 8 months ago by: Guest

Jump to the latest result

Lodash cloneDeep

structuredClone

Json.stringify

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Sumamry (model llama3.2:3b, generated 2 days ago):