Benchmark: Lodash cloneDeep vs structuredClone vs naive 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);
Native 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
Native structuredClone
JSON.stringify

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Browser/OS: Chrome 131 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	1276589.1 Ops/sec
Native structuredClone	697912.4 Ops/sec
JSON.stringify	1517328.1 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Explanation**

The provided JSON represents a JavaScript microbenchmark test case that compares the performance of three methods for creating a deep copy of an object:

1. **Lodash `cloneDeep`**: A popular utility library function developed by Isaac Schlueter, which recursively creates a new object with the same properties as the original object.
2. **Native `structuredClone`**: A newer JavaScript method introduced in ECMAScript 2020, which allows creating a deep copy of an object using the `structuredClone()` function. This method is more efficient than traditional cloning methods like JSON.stringify() and is designed for use cases like copying complex data structures.
3. **JSON.stringify() + JSON.parse()**: A naive approach that uses the `JSON.stringify()` method to convert the original object into a string, and then parses it back using `JSON.parse()` to create a new object.

**Comparison of Options**

Here's a brief overview of each option, including their pros and cons:

* **Lodash `cloneDeep`**:
	+ Pros: Well-tested, widely used, and optimized for performance.
	+ Cons: Adds external dependency (Lodash library), which may not be desirable in all scenarios.
* **Native `structuredClone`**:
	+ Pros: Built-in method, efficient, and designed specifically for creating deep copies.
	+ Cons: May require newer JavaScript engines or browsers that support it.
* **JSON.stringify() + JSON.parse()`:
	+ Pros: Lightweight, widely supported, and doesn't add external dependencies.
	+ Cons: Less efficient than the other two options due to string conversion overhead.

**Library and Its Purpose**

In this benchmark, Lodash's `cloneDeep` function is used as a reference implementation for deep cloning. The library provides various utility functions for tasks like array manipulation, object creation, and more.

**Special JS Feature or Syntax**

The test case uses the newer JavaScript method `structuredClone()` introduced in ECMAScript 2020. This method allows creating a deep copy of an object using the `structuredClone()` function, which is designed to be efficient and safe for use cases like copying complex data structures.

**Other Alternatives**

If you need alternatives to Lodash's `cloneDeep` or want to explore other options:

* For deep cloning without external dependencies:
	+ Microsoft's Array.prototype.slice() and Object.assign()
	+ The library `deepcopy` (not to be confused with the `structuredClone` method)
* For more efficient deep cloning in modern browsers:
	+ Use the `structuredClone()` method, if supported
	+ Implement a custom cloning function using modern JavaScript features like `Proxy` or `JSON.parse(JSON.stringify())`

Keep in mind that the choice of library or method ultimately depends on your specific use case and performance requirements.

Related benchmarks:

Lodash cloneDeep vs structuredClone vs naive JSON.stringify (version: 0)

https://developer.mozilla.org/en-US/docs/Web/API/structuredClone

Comparing performance of: Lodash cloneDeep vs Native structuredClone vs JSON.stringify

Created: 2 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Native structuredClone

JSON.stringify

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