Benchmark: deepClone vs JSON parse/stringify

HTML Preparation code:

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

Script Preparation code:

function deepClone(val) {
    if (typeof val !== 'object' || val === null) {
        return val;
    }
    if (Array.isArray(val)) {
        return val.map((item) => deepClone(item));
    }
    const obj = {};
    for (const key in val) {
        obj[key] = deepClone(val[key]); 
    }
    return obj;
}

var obj1 = {
"problems": [{
    "Diabetes":[{
        "medications":[{
            "medicationsClasses":[{
                "className":[{
                    "associatedDrug":[{
                        "name":"asprin",
                        "dose":"",
                        "strength":3232323
                    }],
                    "associatedDrug#2":[{
                        "name": 3232323,
                        "dose":null,
                        "strength":"500 mg"
                    }]
                }],
                "className2":[{
                    "associatedDrug":[{
                        "name":"asprin",
                        "dose":"",
                        "strength":212132
                    }],
                    "associatedDrug#2":[{
                        "name":4343,
                        "dose":"fdsafd",
                        "strength":32323232
                    }]
                }]
            }]
        }],
        "labs":[{
            "missing_field": "missing_value"
        }]
    }],
    "Asthma":[{}]
}]};

var obj2 = null;

Tests:

JSON parse/stringify
obj2 = JSON.parse(JSON.stringify(obj1));
deepClone
obj2 = deepClone(obj1)
Lodash deepClone
obj2 = _.cloneDeep(obj1);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
JSON parse/stringify
deepClone
Lodash deepClone

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.2.1 Safari/605.1.15

Browser/OS: Safari 17 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
JSON parse/stringify	556715.3 Ops/sec
deepClone	273719.3 Ops/sec
Lodash deepClone	205223.7 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the benchmark and explain what's being tested.

**Benchmark Definition**

The benchmark is testing three different approaches to create a deep copy of an object in JavaScript:

1. **JSON parse/stringify**: Using `JSON.parse(JSON.stringify(obj1))`
2. **Deep cloning**: Implementing a custom `deepClone` function using recursive logic
3. **Lodash deepClone**: Using the `_.cloneDeep` method from the Lodash library

**What's being tested**

The benchmark is comparing the execution speed of these three approaches on a large object `obj1`, which contains nested objects and arrays.

**Options compared**

The options being compared are:

* JSON parse/stringify: A simple, but potentially slow approach to create a deep copy.
* Deep cloning: An implementational approach using recursive logic.
* Lodash deepClone: A library-based approach using the optimized implementation of the `_.cloneDeep` method.

**Pros and Cons**

Here's a brief summary of the pros and cons of each approach:

1. **JSON parse/stringify**:
	* Pros: Simple, easy to implement, widely supported.
	* Cons: Potentially slow due to the overhead of parsing and stringifying JSON data.
2. **Deep cloning**:
	* Pros: Customizable, can be optimized for specific use cases.
	* Cons: Requires manual implementation of recursive logic, which can be error-prone and time-consuming.
3. **Lodash deepClone**:
	* Pros: Optimized, widely tested, and maintained by a community-driven library.
	* Cons: Adds an external dependency (Lodash), may not be suitable for very large objects due to memory constraints.

**Library usage**

The benchmark uses the Lodash library, which provides optimized implementations of various utility functions, including `_.cloneDeep`. The use of Lodash adds an additional layer of complexity, as it requires importing and initializing the library.

**Special JS feature or syntax**

None of the approaches mentioned rely on any special JavaScript features or syntax. They are all based on standard ECMAScript language features.

**Other alternatives**

If you need to create a deep copy of objects in JavaScript, other alternatives include:

* Using `Array.prototype.slice()` and `Object.assign()`
* Implementing a custom `deepClone` function using iterative logic (e.g., using `for...in` loops)
* Utilizing a third-party library like Immutable.js or js-yaml

Keep in mind that the best approach depends on your specific use case, performance requirements, and personal preference.

Related benchmarks:

deepClone vs JSON parse/stringify (version: 5)

Comparing performance of: JSON parse/stringify vs deepClone vs Lodash deepClone

Created: 2 years ago by: Registered User

Jump to the latest result

JSON parse/stringify

deepClone

Lodash deepClone

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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