Benchmark: Lodash cloneDeep vs JSON Clone vs Object Spread

HTML Preparation code:

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

Script Preparation code:

var MyObject = {
  description: 'Creates a deep copy of source, which should be an object or an array.',
  myNumber: 123456789,
  myBoolean: true,
  jayson: {
    stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
    parse: 'JSON.parse() method parses a JSON string...'
  }
};

var myArray = [];

for (let i = 0; i < 1000; i++) {
  myArray.push(MyObject);
}

var myCopy = null;

Tests:

Lodash cloneDeep
myCopy = _.cloneDeep(myArray);
Json clone
myCopy = JSON.parse(JSON.stringify(myArray));
Spread Object Map
myCopy = myArray.map((e) => ({ ...e }))

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Json clone
Spread Object Map

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 dive into the world of JavaScript microbenchmarks and explore what's being tested in this specific benchmark.

**Benchmark Overview**

The provided JSON represents a benchmark test that compares three different methods for cloning or creating copies of an object or array:

1.  **Lodash cloneDeep**: Uses the `_.cloneDeep()` function from the Lodash library to create a deep copy of the original object.
2.  **JSON Clone**: Uses the `JSON.parse(JSON.stringify())` method to convert the object to a JSON string and then parse it back into an object, effectively cloning it.
3.  **Spread Object Map**: Uses the spread operator (`{ ...e }`) in combination with the `Array.prototype.map()` function to create a new array of cloned objects.

**Options Compared**

These three options are compared to determine which one is the fastest and most efficient method for creating copies of an object or array. The goal is to identify the best approach for similar use cases.

**Pros and Cons of Each Approach**

*   **Lodash cloneDeep**:
    *   Pros: Provides a more robust and flexible way to create deep copies, especially when dealing with complex objects.
    *   Cons: Requires an additional library (Lodash) to be included in the benchmark, which might add overhead.
*   **JSON Clone**:
    *   Pros: Simple and lightweight, as it only relies on built-in JavaScript functionality.
    *   Cons: May not work correctly for all types of objects or arrays, especially those with circular references. It also converts the object to a JSON string, which can be unnecessary and wasteful.
*   **Spread Object Map**:
    *   Pros: Uses modern JavaScript features (spread operator) and is relatively lightweight.
    *   Cons: May not work correctly for all types of objects or arrays, especially those with complex properties. It also creates a new array, which might consume more memory.

**Library: Lodash**

Lodash is a popular JavaScript utility library that provides a wide range of functions for tasks such as string manipulation, array and object manipulation, and functional programming. The `_.cloneDeep()` function in particular is designed to create deep copies of objects, making it an attractive option for this benchmark.

**Special JS Feature/Syntax: Spread Operator**

The spread operator (`{ ...e }`) is a modern JavaScript feature that allows you to create new objects by copying properties from an existing object. In the context of this benchmark, it's used in combination with `Array.prototype.map()` to create a new array of cloned objects.

**Other Alternatives**

There are other methods for creating copies of objects or arrays in JavaScript, such as:

*   Using the `Object.assign()` method to copy properties from an object.
*   Implementing a custom copying function using recursion and/or iteration.
*   Using a library like Immutable.js, which provides a way to create immutable data structures.

These alternatives might be suitable for specific use cases or performance-critical applications, but they may not be as widely supported or efficient as the options tested in this benchmark.

Related benchmarks:

Lodash cloneDeep vs JSON Clone vs Object Spread (version: 0)

Comparing performance of: Lodash cloneDeep vs Json clone vs Spread Object Map

Created: 4 years ago by: Registered User

Jump to the latest result

Lodash cloneDeep

Json clone

Spread Object Map

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