Benchmark: Object cloning with Lodash clone vs cloneDeep vs merge vs structuredClone vs JSON.parse(JSON.stringify(o)) 2

HTML Preparation code:

<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

var o = {
 a: {
   b: 1,
   c: 2,
   d: 3,
   j: {
     k: [1,2,3],
     l: [4,5,6]
   },
 },
 e: [1,2,3,4,5,6],
 f: 1,
 g: {
   h: 1,
 }
}

Tests:

Lodash clone
const a = _.clone(o)
Lodash cloneDeep
const a = _.cloneDeep(o)
JSON.parse(JSON.stringify(o))
const a = JSON.parse(JSON.stringify(o))
structuredClone
const a = structuredClone(o)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash clone
Lodash cloneDeep
JSON.parse(JSON.stringify(o))
structuredClone

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 119 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Lodash clone	3340079.5 Ops/sec
Lodash cloneDeep	501803.0 Ops/sec
JSON.parse(JSON.stringify(o))	833871.2 Ops/sec
structuredClone	482286.3 Ops/sec

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

LLMs can make mistakes. Check important info.

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

**Benchmark Overview**

The benchmark compares four different methods for cloning or manipulating objects in JavaScript:

1. Lodash `clone`
2. Lodash `cloneDeep`
3. Using `JSON.parse(JSON.stringify(o))` (also known as "deep copying")
4. `structuredClone`

These methods are compared to measure their performance, accuracy, and any potential differences.

**Method 1: Lodash `clone`**

Lodash's `clone` function creates a shallow copy of an object, which means it only copies the top-level properties and not nested objects or arrays. This can lead to issues if you're trying to clone deeply nested structures.

Pros:

* Fast performance
* Simple to use

Cons:

* May not work correctly for deeply nested structures
* Doesn't preserve custom methods or functions

**Method 2: Lodash `cloneDeep`**

Lodash's `cloneDeep` function creates a deep copy of an object, which means it recursively copies all nested objects and arrays. This is more suitable for cloning complex data structures.

Pros:

* Preserves custom methods or functions
* Works correctly with deeply nested structures

Cons:

* Slower performance compared to `clone`
* May use more memory due to the recursive copying process

**Method 3: Using `JSON.parse(JSON.stringify(o))`**

This method uses the fact that in JSON, objects are serialized to a flat representation. When deserializing this string back into an object, it creates a deep copy of the original object.

Pros:

* Fast performance
* Works correctly with deeply nested structures

Cons:

* Can be fragile if the object contains functions or other non-serializable values.
* May not work well with circular references (i.e., objects that reference themselves).

**Method 4: `structuredClone`**

This method is a relatively new addition to JavaScript, introduced in ES2022. It creates a deep copy of an object, preserving all its properties, including functions and other non-serializable values.

Pros:

* Preserves custom methods or functions
* Works correctly with deeply nested structures
* No risk of circular references

Cons: None mentioned yet (since it's a relatively new feature).

**Library Explanation**

The benchmark uses Lodash as the library for the `clone` and `cloneDeep` functions. Lodash is a popular JavaScript utility library that provides various functions for tasks like array manipulation, object cloning, and more.

In this specific benchmark, Lodash's `clone` function creates a shallow copy of an object, while `cloneDeep` creates a deep copy. The `structuredClone` method is used as-is since it's introduced in ES2022.

**Other Considerations**

The test cases use the same input object `o`, which contains various nested structures (objects, arrays, functions). This allows us to compare the performance and accuracy of each method on similar inputs.

It's worth noting that some methods may have specific edge cases or limitations. For example, Lodash's `clone` function may not work correctly if the original object contains circular references.

**Alternatives**

If you're looking for alternative JavaScript libraries or built-in functions for object cloning or manipulation, here are a few options:

1. Underscore.js (similar to Lodash): Provides various utility functions, including `clone` and `cloneDeep`.
2. Immutable.js: A library that provides immutable data structures and methods for copying and manipulating them.
3. Built-in JavaScript methods:
	* `Object.assign()` or `Object.create()` can be used to create a shallow copy of an object.
	* `JSON.parse(JSON.stringify(o))` (described above) can be used as a deep copy method.

However, keep in mind that these alternatives may have different performance characteristics, accuracy, and usage scenarios compared to the methods tested in this benchmark.

Related benchmarks:

Object cloning with Lodash clone vs cloneDeep vs merge vs structuredClone vs JSON.parse(JSON.stringify(o)) 2 (version: 0)

Comparing performance of: Lodash clone vs Lodash cloneDeep vs JSON.parse(JSON.stringify(o)) vs structuredClone

Created: one year ago by: Guest

Jump to the latest result

Lodash clone

Lodash cloneDeep

JSON.parse(JSON.stringify(o))

structuredClone

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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