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>

AخA
 
<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;

​x
 
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);
myCopy = _.cloneDeep(MyObject);
Native structuredClone
myCopy = structuredClone(MyObject);
myCopy = structuredClone(MyObject);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
Lodash cloneDeep
Native structuredClone

Fastest: N/A

Slowest: N/A

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

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

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:

Lodash cloneDeep: Uses the _.cloneDeep function from Lodash to create a deep copy of the object.
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.

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.

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 5 months ago):