Benchmark: Lodash cloneDeep vs native cloneDeep vs dom cloneDeep

HTML Preparation code:

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

Script Preparation code:

var testArray = [{
  description: 'Random description.',
  testNumber: 123456789,
  testBoolean: true,
  testObject: {
    testString: 'test string',
    testNumber: 12345
  },
  testArray: [{
    myName: 'test name',
    myNumber: 123245
  }]
},{
  description: 'Random description.',
  testNumber: 123456789,
  testBoolean: true,
  testObject: {
    testString: 'test string',
    testNumber: 12345
  },
  testArray: [{
    myName: 'test name',
    myNumber: 123245
  }]
}];

var testCopy = null;

var deepClone = function(obj) {
   var out;
    if (Array.isArray(obj)) {
        out = [];
        for (var index = 0; index < obj.length; ++index) {
            let subArray = obj[index];
            out.push((subArray === null) ? subArray : (subArray instanceof Date) ? new Date(subArray.valueOf()) : (typeof subArray === 'object') ? deepClone(subArray) : subArray);
        }
    } else {
        out = {};
        for (var key in obj) {
            var subObject = obj[key];
            out[key] = subObject === null ? subObject : subObject instanceof Date ? new Date(subObject.valueOf()) : (typeof subObject === 'object') ? deepClone(subObject) : subObject;
            
           
        }
    }
    return out;
};


var cloneDeep2 = (data) => {
  
  if (typeof data === 'object' && data != null) {
    
    const clonedObj = Array.isArray(data) ? [] : {};

    for(let key in data) {
      if (typeof data[key] === 'object')
      {
        clonedObj[key] = cloneDeep2(data[key]);
      }
    }
    return clonedObj;
  }
  return data;
}

Tests:

Lodash cloneDeep
testCopy = _.cloneDeep(testArray);
Recursive deep clone
testCopy = deepClone(testArray);
Dom deep clone
testCopy = cloneDeep2(testArray);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Recursive deep clone
Dom deep clone

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 break down what's being tested in the provided JSON benchmark.

**Benchmark Overview**

The test compares three different approaches to cloning an array: Lodash's `cloneDeep` method, a recursive custom implementation (`deepClone`), and another library called "dom" (specifically, `cloneDeep2`). The goal is to determine which approach produces the most accurate and efficient clone of the input array.

**Options Being Compared**

1. **Lodash Clone Deep**: Uses Lodash's built-in `cloneDeep` function to create a deep copy of the input array.
2. **Recursive Custom Implementation (Deep Clone)**: A custom implementation that recursively clones each element in the array, including nested objects and arrays.
3. **Dom Clone Deep**: Uses an unknown library (`cloneDeep2`) that provides a deep cloning functionality.

**Pros and Cons of Each Approach**

1. **Lodash Clone Deep**:
	* Pros: Fast, efficient, and well-tested.
	* Cons: May not work correctly with certain edge cases (e.g., circular references) or may require additional configuration.
2. **Recursive Custom Implementation (Deep Clone)**:
	* Pros: Provides a high degree of control over the cloning process, can handle complex data structures.
	* Cons: May be slower than Lodash's implementation due to the overhead of recursive function calls.
3. **Dom Clone Deep**:
	* Pros: Unknown library may provide optimized performance or specific features not available in other implementations.
	* Cons: Uncertainty about the library's accuracy, performance, and compatibility.

**Library Descriptions**

1. **Lodash**: A popular JavaScript utility library that provides a wide range of functions for data manipulation, string manipulation, and more.
2. **Dom Clone Deep (cloneDeep2)**: Not explicitly described in the benchmark, but its purpose is to provide a deep cloning functionality, likely with optimized performance.

**Special JS Features/Syntax**

None mentioned in this explanation. However, it's worth noting that the `deepClone` implementation uses a recursive function call pattern, which can be beneficial for complex data structures but may lead to stack overflow errors for very large inputs.

**Alternative Approaches**

Other approaches could include:

* Using `JSON.parse(JSON.stringify(obj))` to create a shallow copy of an object.
* Utilizing `Array.prototype.slice()` or `Array.prototype.concat()` to create a shallow copy of an array.
* Implementing a custom cloning function using the `Map` and `WeakMap` data structures.

Keep in mind that these alternative approaches may not be as efficient or accurate as Lodash's implementation, especially for complex data structures.

Related benchmarks:

Lodash cloneDeep vs native cloneDeep vs dom cloneDeep (version: 0)

compare array copy/clone methods

Comparing performance of: Lodash cloneDeep vs Recursive deep clone vs Dom deep clone

Created: 4 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Recursive deep clone

Dom deep clone

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):