Benchmark: Lodash cloneDeep vs structuredClone vs recursiveDeepCopy vs JSON clone with a more deep test

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...',
        object: {
            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...',
                object: {
                    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...',
                        object: {
                            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...',
                                object: {
                                    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...',
                                        object: {
                                            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;

function recursiveDeepCopy(o) {
    var newO,
        i;

    if (typeof o !== 'object') {
        return o;
    }
    if (!o) {
        return o;
    }

    if ('[object Array]' === Object.prototype.toString.apply(o)) {
        newO = [];
        for (i = 0; i < o.length; i += 1) {
            newO[i] = recursiveDeepCopy(o[i]);
        }
        return newO;
    }

    newO = {};
    for (i in o) {
        if (o.hasOwnProperty(i)) {
            newO[i] = recursiveDeepCopy(o[i]);
        }
    }
    return newO;
}

​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...',        object: {            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...',                object: {                    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...',                        object: {                            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...',                                object: {                                    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...',                                        object: {                                            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;​function recursiveDeepCopy(o) {    var newO,        i;​    if (typeof o !== 'object') {        return o;    }    if (!o) {        return o;    }​    if ('[object Array]' === Object.prototype.toString.apply(o)) {        newO = [];        for (i = 0; i < o.length; i += 1) {            newO[i] = recursiveDeepCopy(o[i]);        }        return newO;    }​    newO = {};    for (i in o) {        if (o.hasOwnProperty(i)) {            newO[i] = recursiveDeepCopy(o[i]);        }    }    return newO;}

Tests:

Lodash
myCopy = _.cloneDeep(MyObject);
myCopy = _.cloneDeep(MyObject);
structuredClone
myCopy = structuredClone(MyObject);
myCopy = structuredClone(MyObject);
recursiveDeepCopy
myCopy = recursiveDeepCopy(MyObject);
myCopy = recursiveDeepCopy(MyObject);
Json clone
myCopy = JSON.parse(JSON.stringify(MyObject));
myCopy = JSON.parse(JSON.stringify(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
structuredClone
recursiveDeepCopy
Json clone

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/120.0.0.0 Safari/537.36

Browser/OS: Chrome 120 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Lodash	211190.8 Ops/sec
structuredClone	127802.0 Ops/sec
recursiveDeepCopy	227261.9 Ops/sec
Json clone	129593.4 Ops/sec

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

Measuring the performance of different methods for deep cloning objects in JavaScript is an essential task, especially when working with complex data structures.

Benchmark Definition

The benchmark definition provided measures the performance of four different methods for creating a deep copy of a JavaScript object:

Lodash.cloneDeep
structuredClone
recursiveDeepCopy (a custom implementation)
JSON.parse(JSON.stringify())

Options Compared

Each option has its own strengths and weaknesses:

Lodash.cloneDeep: A popular and well-maintained library function for deep cloning objects. It's efficient and works well with most data structures.
structuredClone: A new JavaScript standard feature (introduced in ECMAScript 2020) that provides a safe way to create deep clones of objects, arrays, and maps. It's designed to be fast and efficient.
recursiveDeepCopy: A custom implementation provided in the benchmark definition. While it may seem like an interesting alternative, its performance is likely to be slower than the other two options.
JSON.parse(JSON.stringify()): A simple but inefficient method for creating a deep copy of objects. It's not recommended for large data structures due to potential issues with circular references.

Pros and Cons

Here's a brief summary of each option:

Lodash.cloneDeep:
- Pros: Fast, efficient, well-tested, and widely used.
- Cons: May not work correctly with some data structures (e.g., Map or Set).
structuredClone:
- Pros: Fast, efficient, safe, and designed for large data structures.
- Cons: New standard feature, may require more setup (e.g., browser support).
recursiveDeepCopy:
- Pros: Custom implementation, potentially faster than Lodash.cloneDeep.
- Cons: Performance is likely to be slower due to the custom implementation.
JSON.parse(JSON.stringify()):
- Pros: Simple and easy to understand.
- Cons: Inefficient, may not work correctly with circular references.

Benchmark Results

The latest benchmark results show that:

structuredClone is the fastest option, followed closely by Lodash.cloneDeep.
recursiveDeepCopy is slower than both Lodash and structured Clone.
JSON.parse(JSON.stringify()) is the slowest option due to its inefficiencies.

In conclusion, for most use cases, structuredClone is the recommended choice for deep cloning objects in JavaScript, thanks to its speed, efficiency, and safety features.

LLMs can make mistakes. Check important info.

Measuring the performance of different methods for deep cloning objects in JavaScript is an essential task, especially when working with complex data structures.

**Benchmark Definition**

The benchmark definition provided measures the performance of four different methods for creating a deep copy of a JavaScript object:

1. `Lodash.cloneDeep`
2. `structuredClone`
3. `recursiveDeepCopy` (a custom implementation)
4. `JSON.parse(JSON.stringify())`

**Options Compared**

Each option has its own strengths and weaknesses:

* **Lodash.cloneDeep**: A popular and well-maintained library function for deep cloning objects. It's efficient and works well with most data structures.
* **structuredClone**: A new JavaScript standard feature (introduced in ECMAScript 2020) that provides a safe way to create deep clones of objects, arrays, and maps. It's designed to be fast and efficient.
* **recursiveDeepCopy**: A custom implementation provided in the benchmark definition. While it may seem like an interesting alternative, its performance is likely to be slower than the other two options.
* **JSON.parse(JSON.stringify())**: A simple but inefficient method for creating a deep copy of objects. It's not recommended for large data structures due to potential issues with circular references.

**Pros and Cons**

Here's a brief summary of each option:

* **Lodash.cloneDeep**:
	+ Pros: Fast, efficient, well-tested, and widely used.
	+ Cons: May not work correctly with some data structures (e.g., `Map` or `Set`).
* **structuredClone**:
	+ Pros: Fast, efficient, safe, and designed for large data structures.
	+ Cons: New standard feature, may require more setup (e.g., browser support).
* **recursiveDeepCopy**:
	+ Pros: Custom implementation, potentially faster than Lodash.cloneDeep.
	+ Cons: Performance is likely to be slower due to the custom implementation.
* **JSON.parse(JSON.stringify())**:
	+ Pros: Simple and easy to understand.
	+ Cons: Inefficient, may not work correctly with circular references.

**Benchmark Results**

The latest benchmark results show that:

1. `structuredClone` is the fastest option, followed closely by `Lodash.cloneDeep`.
2. `recursiveDeepCopy` is slower than both Lodash and structured Clone.
3. `JSON.parse(JSON.stringify())` is the slowest option due to its inefficiencies.

In conclusion, for most use cases, **structuredClone** is the recommended choice for deep cloning objects in JavaScript, thanks to its speed, efficiency, and safety features.

Related benchmarks:

Lodash cloneDeep vs structuredClone vs recursiveDeepCopy vs JSON clone with a more deep test (version: 0)

Comparing performance of: Lodash vs structuredClone vs recursiveDeepCopy vs Json clone

Created: one year ago by: Guest

Jump to the latest result

Lodash

structuredClone

recursiveDeepCopy

Json clone

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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