Benchmark: Lodash cloneDeep vs native cloneDeep - deepclone only

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;
};

Tests:

Lodash cloneDeep
testCopy = _.cloneDeep(testArray);
Native map deep slice(turns objects into arrays)
testCopy = testArray.map(arr => testArray.slice());
Native JSON parse
testCopy = JSON.parse(JSON.stringify(testArray));
Object.assign shallow clone
testCopy = Object.assign([...testArray]);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Native map deep slice(turns objects into arrays)
Native JSON parse
Object.assign shallow 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/116.0.0.0 Safari/537.36

Browser/OS: Chrome 116 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	450916.8 Ops/sec
Native map deep slice(turns objects into arrays)	6329555.5 Ops/sec
Native JSON parse	503220.1 Ops/sec
Object.assign shallow clone	7047201.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

**Benchmark Definition**

The provided JSON represents a benchmark definition, which outlines the test scenario and the approaches to be compared. The main objective is to compare four different methods for cloning or copying arrays in JavaScript:

1. **Lodash cloneDeep**: Uses the `_.cloneDeep()` function from the Lodash library to create a deep copy of the input array.
2. **Native map deep slice**: Creates a new array by mapping over the original array and slicing each element using `Array.prototype.slice()`.
3. **Native JSON parse**: Parses the input array as JSON and then parses it again to create a new, identical array.
4. **Object.assign shallow clone**: Uses the `Object.assign()` method to create a shallow copy of the input array.

**Options Compared**

The benchmark compares the performance of these four approaches, measuring the number of executions per second for each browser and device platform.

**Pros and Cons of Each Approach**

1. **Lodash cloneDeep**:
	* Pros: Easy to use, efficient, and well-tested.
	* Cons: Requires an additional library (Lodash), which may add overhead.
2. **Native map deep slice**:
	* Pros: No additional libraries required, can be optimized for specific use cases.
	* Cons: May have performance overhead due to the `map()` and `slice()` methods.
3. **Native JSON parse**:
	* Pros: Simple and straightforward implementation.
	* Cons: May have performance overhead due to the two parsing steps.
4. **Object.assign shallow clone**:
	* Pros: Fast and efficient, suitable for shallow copies.
	* Cons: Limited to shallow copying (only first-level elements are copied).

**Special JS Features or Syntax**

None mentioned in this specific benchmark.

**Other Considerations**

When choosing a cloning method, consider the following factors:

* **Shallow vs. deep copying**: If you need to copy only the top-level elements, `Object.assign()` might be sufficient. However, if you need to preserve nested objects and arrays, `_.cloneDeep()` or the native `map` + `slice()` approach is likely better.
* **Performance overhead**: Be aware of any additional libraries required for certain methods (e.g., Lodash) and consider the impact on performance.
* **Use cases**: Different cloning methods may be more suitable for specific use cases, such as large datasets or data structures with complex nesting.

**Alternatives**

Other alternatives to the mentioned approaches include:

* Using `Array.prototype.slice()` alone without `map()`, which would still create a shallow copy.
* Implementing your own custom cloning function, which can provide fine-grained control but may also introduce complexity and overhead.
* Utilizing other libraries or frameworks that offer optimized cloning functions (e.g., Ramda, Immutable.js).

Keep in mind that the choice of cloning method ultimately depends on the specific requirements and constraints of your project.

Related benchmarks:

Lodash cloneDeep vs native cloneDeep - deepclone only (version: 0)

compare array copy/clone methods

Comparing performance of: Lodash cloneDeep vs Native map deep slice(turns objects into arrays) vs Native JSON parse vs Object.assign shallow clone

Created: 2 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Native map deep slice(turns objects into arrays)

Native JSON parse

Object.assign shallow clone

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