Benchmark: Deep cloning comparison - Native vs. JSON vs. Lodash

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,
  mySet: new Set([1, 2, 3, 4, 5]),
  jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...'
  },
  myDate: new Date()
};

var myCopy = null;

Tests:

Lodash cloneDeep
myCopy = _.cloneDeep(MyObject);
Native JS structuredClone
myCopy = structuredClone(MyObject);
JSON parse + 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 JS structuredClone
JSON parse + stringify

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

Let's dive into the explanation of the provided benchmark.

**Benchmark Purpose:**

The benchmark tests the performance of three different methods for deep cloning an object in JavaScript:

1. Native JavaScript `structuredClone()`
2. JSON parse + stringify
3. Lodash `cloneDeep()` function

**Options Compared:**

Each option is compared to measure its performance. The options are:

* **Native JavaScript `structuredClone()`**: A new method introduced in ECMAScript 2020 that creates a deep clone of an object.
* **JSON parse + stringify**: This approach involves converting the original object to a JSON string and then parsing it back into an object.
* **Lodash `cloneDeep()` function**: A popular utility library for functional programming, providing a way to create deep clones of objects.

**Pros and Cons:**

* **Native JavaScript `structuredClone()`:**
	+ Pros: Simple, straightforward implementation. Fast and efficient on modern browsers.
	+ Cons: Limited support on older browsers (pre-ECMAScript 2020).
* **JSON parse + stringify:**
	+ Pros: Works on all browsers and platforms, doesn't require additional libraries.
	+ Cons: Inefficient due to the overhead of serializing and deserializing objects. Can lead to slower performance compared to native methods.
* **Lodash `cloneDeep()` function:**
	+ Pros: Robust implementation, handles edge cases like cyclic references.
	+ Cons: Adds an extra dependency (the Lodash library), which might not be desirable for all projects.

**Library and Syntax Used:**

* The benchmark uses the Lodash library (`lodash.min.js`) in its HTML preparation code. This is a popular utility library that provides various functions, including `cloneDeep()`.
* There are no special JavaScript features or syntax used in this benchmark.

**Other Considerations:**

When using JSON parse + stringify, it's essential to consider the trade-off between performance and data integrity. While this approach works on all browsers and platforms, it may lead to slower performance due to the overhead of serializing and deserializing objects.

In contrast, native methods like `structuredClone()` are designed for efficiency and scalability, making them a better choice for performance-critical applications.

**Alternatives:**

Other alternatives for deep cloning in JavaScript include:

* `Object.assign()`: While not suitable for deep cloning due to its limitations on object references.
* `Array.prototype.slice()`: Not recommended for deep cloning as it creates a shallow copy at best.
* `JSON.parse(JSON.stringify(obj))`: Similar to the JSON parse + stringify approach, but with added complexity.

In summary, the benchmark provides a clear comparison of three methods for deep cloning in JavaScript, highlighting the trade-offs between performance, efficiency, and data integrity.

Related benchmarks:

Deep cloning comparison - Native vs. JSON vs. Lodash (version: 0)

Comparing performance of: Lodash cloneDeep vs Native JS structuredClone vs JSON parse + stringify

Created: 3 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Native JS structuredClone

JSON parse + stringify

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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