Benchmark: Lodash cloneDeep vs structuredClone vs JSON encoding

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 encoding
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 encoding

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Mobile Safari 18 on iOS 18.0.1

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	3112935.5 Ops/sec
Native structuredClone	952818.7 Ops/sec
JSON encoding	2071859.2 Ops/sec

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

LLMs can make mistakes. Check important info.

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

**Benchmark Definition**

The benchmark measures the performance of three methods for creating a deep copy of an object:

1. `_.cloneDeep` from Lodash (a popular JavaScript utility library)
2. The native `structuredClone` API (introduced in ECMAScript 2022)
3. The `JSON.parse(JSON.stringify())` method (also known as "JSON encoding")

**Test Case**

The benchmark consists of three test cases:

1. **Lodash cloneDeep**: Creates a deep copy of the `MyObject` using Lodash's `_cloneDeep` function.
2. **Native structuredClone**: Creates a deep copy of the `MyObject` using the native `structuredClone` API (available in modern browsers).
3. **JSON encoding**: Creates a deep copy of the `MyObject` by first converting it to a JSON string using `JSON.stringify()` and then parsing it back into an object using `JSON.parse()`.

**Pros and Cons**

1. **Lodash cloneDeep**:
	* Pros: Widely supported, mature library with extensive feature set.
	* Cons: Adds extra overhead due to the Lodash library.
2. **Native structuredClone**:
	* Pros: Optimized for performance, native implementation reduces overhead.
	* Cons: Requires modern browsers that support the `structuredClone` API (not all browsers).
3. **JSON encoding**:
	* Pros: Simple, widely supported across older browsers and environments.
	* Cons: May not preserve all object properties or behaviors.

The native `structuredClone` API is likely the most efficient option due to its optimized implementation. However, its availability is limited to modern browsers.

**Library - Lodash**

Lodash is a popular JavaScript utility library that provides various functions for tasks such as data manipulation, function composition, and more. In this case, `_cloneDeep` is used to create a deep copy of an object. Lodash's popularity stems from its extensive feature set, simplicity, and ease of use.

**Special JS Feature - `structuredClone` API**

The `structuredClone` API was introduced in ECMAScript 2022 as a standardized method for creating deep copies of objects. It's optimized for performance and provides better support than older methods like `JSON.parse(JSON.stringify())`. The native implementation reduces overhead compared to using Lodash or other libraries.

In summary, the benchmark compares the performance of three methods for creating a deep copy of an object: Lodash's `_cloneDeep`, the native `structuredClone` API, and JSON encoding. The results highlight the efficiency of the native `structuredClone` API while acknowledging its limitations due to browser support.

Related benchmarks:

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

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

Comparing performance of: Lodash cloneDeep vs Native structuredClone vs JSON encoding

Created: one year ago by: Guest

Jump to the latest result

Lodash cloneDeep

Native structuredClone

JSON encoding

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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