Benchmark: lodash clonedeep vs json.parse(stringify()) vs deepClone v3

HTML Preparation code:

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

Script Preparation code:

var Books = [
  {
    id: 1,
    title: 'Great Book',
    price: 12.99,
    available: true
  },
  {
    id: 2,
    title: 'Another Great Book',
    price: 11.99,
    available: false
  },
  {
    id: 3,
    title: 'Another Great Book',
    price: 9.99,
    available: true
  },
  {
    id: 4,
    title: 'Another Great Book',
    price: 8.99,
    available: true
  },
  {
    id: 5,
    title: 'Another Great Book',
    price: 13.99,
    available: false
  } 
];

var clone = null;

function deepClone(source) {

    if (source instanceof Date) return new Date(source.getTime())

    if (Array.isArray(source)) {
      const clone = []
      let i = source.length
      
      while (i--) {
        const value = source[i]
        clone[i] = (typeof value === 'object') ? deepClone(value) : value
      }
      
      return clone
    }

    const clone = {}

    for (const key in source) {
      if (source.hasOwnProperty(key)) {
        const value = source[key]
        clone[key] = (typeof value === 'object') ? deepClone(value) : value
      }
    }

    return clone
}

Tests:

Lodash CloneDeep
clone = _.cloneDeep(Books);
Json Clone
clone = JSON.parse(JSON.stringify(Books));
deepClone
clone = deepClone(Books);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash CloneDeep
Json Clone
deepClone

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 this benchmark.

**Benchmark Overview**

The benchmark compares the performance of three different approaches to deep clone an array of objects:

1. Lodash's `cloneDeep` function
2. The `JSON.parse(JSON.stringify())` method (also known as "JSON cloning")
3. A custom `deepClone` function

**Options Compared**

Here are the options being compared:

* **Lodash CloneDeep**: Uses the `cloneDeep` function from the Lodash library to create a deep copy of the input array.
	+ Pros: Highly optimized, widely used and tested, provides additional features like preserving object references.
	+ Cons: Requires an external dependency (the Lodash library), can be larger in size due to the inclusion of this library.
* **JSON Clone**: Uses the `JSON.parse(JSON.stringify())` method to create a deep copy of the input array. This is a built-in JavaScript method that converts JSON data into JavaScript objects and vice versa.
	+ Pros: No external dependency, lightweight, easy to implement.
	+ Cons: Can lose object references during cloning, may not preserve all properties (e.g., functions), and can be slow for large inputs due to the parsing step.
* **Custom deepClone**: A custom implementation of a deep clone function that manually iterates through the input array and creates new objects with deep copies of their properties.
	+ Pros: Lightweight, easy to implement, no external dependencies.
	+ Cons: Requires manual maintenance and optimization for performance.

**Library Used**

The benchmark uses the Lodash library, which provides a convenient and efficient way to perform deep cloning. The `cloneDeep` function is specifically designed to create deep copies of arrays and objects while preserving their properties.

**Special JS Feature/Syntax**

There are no special JavaScript features or syntaxes being tested in this benchmark. All three approaches are purely functional programming techniques for creating deep clones.

**Alternative Approaches**

Some alternative approaches to deep cloning include:

* Using `Object.assign()` with an empty object to create a shallow copy, and then recursively cloning the resulting objects using a custom function.
* Using `Array.prototype.map()` to create a new array with cloned elements.
* Using a library like Immutable.js or Ramda, which provide functional programming utilities for working with data structures.

Keep in mind that each of these alternative approaches has its own trade-offs in terms of performance, complexity, and dependencies.

Related benchmarks:

lodash clonedeep vs json.parse(stringify()) vs deepClone v3 (version: 2)

Comparing performance of: Lodash CloneDeep vs Json Clone vs deepClone

Created: 3 years ago by: Registered User

Jump to the latest result

Lodash CloneDeep

Json Clone

deepClone

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