Benchmark: Object cloning with Lodash clone vs cloneDeep vs merge vs ES6 object spread vs ES6 Object.assign

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)
Lodash merge
const a = _.merge({}, o)
ES6 spread
const a = { ...o }
ES6 Object.assign
const a = Object.assign({}, o)

Historical Performance Data aggregated from 25 community runs

Desktop Results:

Chrome 25 runs

ES6 spread

24.0M/s

ES6 Object.assign

8.1M/s

Lodash clone

3.2M/s

Lodash cloneDeep

457K/s

Lodash merge

283K/s

Fastest: ES6 spread (85.0x faster)

View exact numbers

✓ ES6 spread: 24,013,488 ops/sec
• ES6 Object.assign: 8,123,397 ops/sec
• Lodash clone: 3,200,502 ops/sec
• Lodash cloneDeep: 457,381 ops/sec
• Lodash merge: 282,549 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash clone
Lodash cloneDeep
Lodash merge
ES6 spread
ES6 Object.assign

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 10 months ago)

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

Browser/OS: Chrome 140 on Mac OS X 10.15.7

View result in a separate tab

ES6 spread

109.0M/s

ES6 Object.assign

79.1M/s

Lodash clone

7.8M/s

Lodash cloneDeep

856K/s

Lodash merge

626K/s

View exact numbers

Test name	Executions per second
✓ ES6 spread	108,999,760 Ops/sec
ES6 Object.assign	79,148,728 Ops/sec
Lodash clone	7,774,402 Ops/sec
Lodash cloneDeep	855,936 Ops/sec
Lodash merge	626,154 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided benchmark measures the performance of different methods for cloning and manipulating JavaScript objects.

**Methods Compared**

The benchmark compares five methods:

1. **Lodash clone**: Uses Lodash's `clone` function to create a shallow copy of an object.
2. **Lodash cloneDeep**: Uses Lodash's `cloneDeep` function to create a deep copy of an object, including nested arrays and objects.
3. **Lodash merge**: Uses Lodash's `merge` function to merge two objects into one, creating a new object that combines the properties of both input objects.
4. **ES6 spread**: Uses the spread operator (`{ ... }`) to create a shallow copy of an object by spreading its properties into a new object.
5. **ES6 Object.assign**: Uses the `Object.assign` method to create a shallow copy of an object by copying its enumerable own property values.

**Pros and Cons**

Here's a brief summary of each method:

1. **Lodash clone**: Creates a shallow copy of an object, which can be faster than deep copies but may not preserve nested objects. Pros: fast, easy to use. Cons: may not work well with deeply nested objects.
2. **Lodash cloneDeep**: Creates a deep copy of an object, including nested arrays and objects. Pros: preserves nested objects, safe for complex data structures. Cons: slower than shallow copies.
3. **Lodash merge**: Merges two objects into one, creating a new object that combines the properties of both input objects. Pros: fast and easy to use. Cons: may overwrite existing property values without warning.
4. **ES6 spread**: Creates a shallow copy of an object by spreading its properties into a new object. Pros: simple and efficient. Cons: may not work well with deeply nested objects or objects that have non-enumerable properties.
5. **ES6 Object.assign**: Creates a shallow copy of an object by copying its enumerable own property values. Pros: similar to ES6 spread, but more flexible in terms of the types of objects being copied. Cons: may be slower than other methods for very large or complex data sets.

**Library and Syntax**

* **Lodash clone**, **cloneDeep**, and **merge**: These functions are part of the Lodash library, which provides a comprehensive set of utility functions for JavaScript.
* **ES6 spread** and **Object.assign**: These syntaxes are built-in to modern JavaScript environments and do not require any external libraries.

**Special JS Features**

This benchmark does not explicitly use any special JavaScript features or syntax. However, it assumes the presence of modern JavaScript environments that support ES6 features such as template literals (`\r\n`) and the spread operator (`{ ... }`).

**Alternatives**

Other alternatives for cloning and manipulating JavaScript objects include:

* **JSON.parse(JSON.stringify(obj))**: This method creates a deep copy of an object by parsing its JSON representation and then stringifying it back into a JSON string, which is then parsed again to create a new object.
* **Array.prototype.slice() + Object.assign()**: This method creates a shallow copy of an array or object by using `slice()` to create a shallow copy of the array and then merging the resulting slice with another object using `Object.assign()`.
* **Recursion-based cloning methods**: These methods use recursive functions to clone nested objects, but can be slower and more complex than other methods.

Keep in mind that these alternatives may not provide the same level of performance or ease of use as the methods compared in this benchmark.

Object cloning with Lodash clone vs cloneDeep vs merge vs ES6 object spread vs ES6 Object.assign (version: 0)

Comparing performance of: `Lodash clone vs Lodash cloneDeep vs Lodash merge vs ES6 spread vs ES6 Object.assign`

Created: 7 years ago by: Registered User

Go to the latest result

Lodash clone

Lodash cloneDeep

Lodash merge

ES6 spread

ES6 Object.assign

Historical Performance Data aggregated from 25 community runs

Desktop Results:

Chrome 25 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Object cloning with Lodash clone vs cloneDeep vs merge vs ES6 object spread vs ES6 Object.assign (version: 0)

Comparing performance of: Lodash clone vs Lodash cloneDeep vs Lodash merge vs ES6 spread vs ES6 Object.assign

Created: 7 years ago by: Registered User

Go to the latest result

Lodash clone

Lodash cloneDeep

Lodash merge

ES6 spread

ES6 Object.assign

Historical Performance Data aggregated from 25 community runs

Desktop Results:

Chrome 25 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `Lodash clone vs Lodash cloneDeep vs Lodash merge vs ES6 spread vs ES6 Object.assign`