Benchmark: Lodash cloneDeep vs structuredClone 222222

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...',
      jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...',
      jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...',
      jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...',
      jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...',
      jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...',
      jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...',
      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);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Native structuredClone

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down the provided JSON and explain what's being tested, compared, and analyzed.

**Benchmark Overview**

The benchmark measures the performance of two approaches to create a deep copy of an object: `_.cloneDeep` from Lodash and `structuredClone`. The object being copied is a complex nested structure with various types of values (numbers, booleans, objects).

**Library: Lodash**

Lodash is a popular JavaScript utility library that provides a wide range of functions for tasks such as data manipulation, string manipulation, and more. In this case, `_.cloneDeep` is used to create a deep copy of an object.

**Library: structuredClone**

`structuredClone` is a new API introduced in modern browsers (starting from Chrome 67) that provides a way to create a deep copy of an object without using the `JSON.parse()` and `JSON.stringify()` methods. This API aims to improve performance and security compared to traditional JSON-based cloning.

**Comparison Options**

The benchmark compares two approaches:

1. **Lodash cloneDeep**: Uses the `_.cloneDeep` function from Lodash to create a deep copy of the object.
2. **Native structuredClone**: Uses the built-in `structuredClone` API to create a deep copy of the object in modern browsers.

**Pros and Cons**

**Lodash cloneDeep:**

Pros:

* Wide compatibility across older browsers (not supported by `structuredClone`)
* Often used for deeper cloning, as it can handle complex nested structures
* Well-maintained and widely adopted library

Cons:

* Slower performance compared to `structuredClone` in modern browsers

**Native structuredClone:**

Pros:

* Faster performance compared to Lodash cloneDeep in modern browsers
* Designed specifically for deep copying objects without using JSON-based methods
* Improves security by avoiding potential vulnerabilities associated with `JSON.parse()` and `JSON.stringify()`

Cons:

* Limited compatibility across older browsers (not supported)
* May require additional setup or configuration for older browsers

**Other Considerations**

The benchmark also considers the following factors:

* **Browser version**: The results are specific to Chrome 101 on Windows, but other browsers may have different performance characteristics.
* **Device platform and operating system**: The results are specific to a desktop environment, but mobile devices or web applications might exhibit different behavior.

**Alternatives**

Other alternatives for creating deep copies of objects include:

* `Array.prototype.slice()`: Creates a shallow copy of an array
* `Object.assign()`: Creates a shallow copy of an object
* Other libraries like Underscore.js, jQuery, or high-order functions (e.g., `lodash`'s `_.clone()`)

However, these alternatives may not provide the same level of performance and security as `structuredClone` in modern browsers.

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.54 Safari/537.36

Browser/OS: Chrome 101 on Windows

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	224228.7 Ops/sec
Native structuredClone	113827.8 Ops/sec

Related benchmarks:

Lodash cloneDeep vs structuredClone 222222 (version: 0)

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

Comparing performance of: Lodash cloneDeep vs Native structuredClone

Created: 2 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Native structuredClone

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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