Benchmark: Lodash cloneDeep vs Lodash clone vs Array.splice() vs. Object.assign()

HTML Preparation code:

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

Script Preparation code:

var arr = ['one', 'two', 'three', {four: 'five'}];

Tests:

Lodash cloneDeep
var myCopy = _.cloneDeep(arr)
Lodash clone
var myCopy = _.clone(arr)
Array.splice()
var myCopy = arr.splice(0, arr.length)
Object.assign()
var myCopy = Object.assign([], arr)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Lodash clone
Array.splice()
Object.assign()

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.99 Safari/537.36

Browser/OS: Chrome 97 on Linux

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	790837.6 Ops/sec
Lodash clone	3718236.5 Ops/sec
Array.splice()	5436397.0 Ops/sec
Object.assign()	4175555.8 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 benchmark.

**What is tested?**

The benchmark tests four different methods to create a shallow copy of an array in JavaScript:

1. Lodash `cloneDeep` method
2. Lodash `clone` method
3. Using `Array.splice()` with two arguments (i.e., `arr.splice(0, arr.length)`)

These methods are compared to determine which one is the most efficient.

**Options comparison**

Here's a brief overview of each option:

* **Lodash `cloneDeep`**: This method creates a deep copy of an object, including all its nested properties. However, in this benchmark, it's used for shallow copying an array. Despite this, the name suggests that it's meant to be a safe choice.
* **Lodash `clone`**: This method creates a shallow copy of an object, which is what we need here. It's faster than `cloneDeep` because it doesn't create nested copies.
* **Array.splice() with two arguments**: This method removes all elements from the array and returns them as an array. By passing 0 and the length of the array as arguments, it effectively creates a new array with the same elements. However, this approach modifies the original array.

**Pros and Cons**

Here are some pros and cons for each option:

* **Lodash `cloneDeep`**: Pros: safe choice when dealing with nested objects; Cons: not necessary here since we're only copying an array.
* **Lodash `clone`**: Pros: fast and efficient; Cons: might not be suitable for deep copying (although not needed in this case).
* **Array.splice() with two arguments**: Pros: creates a new array without modifying the original; Cons: can be slow due to the overhead of removing elements from the array.

**Library usage**

In this benchmark, Lodash is used as a library. It provides functions for functional programming and data manipulation. In this case, `cloneDeep` and `clone` are used to create copies of objects (and arrays).

**Special JS features or syntax**

There are no special JavaScript features or syntax used in this benchmark. However, it's worth noting that the use of Lodash might be a non-standard approach for creating shallow copies in JavaScript.

**Other alternatives**

If you're not using Lodash, here are some alternative approaches to create shallow copies:

* `Array.prototype.slice()`: creates a shallow copy by returning a new array with references to the original elements.
* `Object.assign()`: can be used to create a shallow copy of an object (including an array), but it requires creating a new object and assigning the properties to it.

Keep in mind that these alternatives might not be as efficient or safe as using Lodash's `clone` method.

Related benchmarks:

Lodash cloneDeep vs Lodash clone vs Array.splice() vs. Object.assign() (version: 0)

For times when a shallow copy is needed, what is the performance difference between these 3 methods.

Comparing performance of: Lodash cloneDeep vs Lodash clone vs Array.splice() vs Object.assign()

Created: 2 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Lodash clone

Array.splice()

Object.assign()

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