Benchmark: deepclone vs deepfreeze

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...'
  }
};

function deepFreeze(object) {
    for (const v of Array.isArray(object) ? object : Object.values(object)) {
        if (v && typeof v === 'object') {
            deepFreeze(v);
        }
    }
    Object.freeze(object);
    return object;
}

function deepClone(object) {
    if (Array.isArray(object)) {
      const len = object.length;
      const result = new Array(len);
      for (let i = 0; i < len; ++i) {
        const v = object[i];
        result[i] = v && typeof v === 'object' ? deepClone(v) : v;
      }
      return result;
    } else {
      const result = {};
      for (const k in object) {
        const v = object[k];
        result[k] = v && typeof v === 'object' ? deepClone(v) : v;
      }
      return result;
    }
}

var myCopy = null;

Tests:

Lodash cloneDeep
myCopy = _.cloneDeep(MyObject);
Json clone
myCopy = JSON.parse(JSON.stringify(MyObject));
freeze and destructure
Object.freeze(MyObject); myCopy = { ...MyObject };
deepClone
myCopy = deepClone(MyObject)
deepFreeze
deepFreeze(MyObject); myCopy = MyObject

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Json clone
freeze and destructure
deepClone
deepFreeze

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks!

The provided JSON represents a benchmark test case created using MeasureThat.net, which aims to measure the performance of different methods for creating deep copies of objects in JavaScript.

**Benchmark Definition:**

The benchmark tests four different approaches:

1. **Lodash `cloneDeep`**: This method uses the `_.cloneDeep` function from the Lodash library to create a deep copy of the object.
2. **JSON.parse(JSON.stringify)**: This method uses the `JSON.parse(JSON.stringify)` trick to create a deep copy of the object by parsing and re-serializing it as JSON.
3. **Object.freeze() and destructuring**: This approach freezes the original object using `Object.freeze()` and then creates a new object by destructuring the frozen object using the spread operator (`{ ...MyObject }`).
4. **Custom deep clone function (deepClone)**: This is the implementation provided in the benchmark code, which recursively clones the object properties.

**Options Compared:**

The benchmark compares the performance of these four approaches:

* Lodash `cloneDeep`
* JSON.parse(JSON.stringify)
* Object.freeze() and destructuring
* Custom deep clone function (deepClone)

**Pros and Cons:**

1. **Lodash `cloneDeep`**:
	* Pros: Reliable, efficient, and widely used.
	* Cons: Requires an external library (Lodash).
2. **JSON.parse(JSON.stringify)**:
	* Pros: Lightweight, simple to implement.
	* Cons: May not work as expected for complex objects or objects with circular references.
3. **Object.freeze() and destructuring**:
	* Pros: Fast, efficient, and does not require an external library.
	* Cons: May not be suitable for all use cases (e.g., frozen objects cannot be modified).
4. **Custom deep clone function (deepClone)**:
	* Pros: Customizable, flexible, and can handle complex objects.
	* Cons: May be slower than optimized libraries like Lodash.

**Other Considerations:**

When choosing a method for creating deep copies in JavaScript, consider the following factors:

* Performance: If speed is critical, Object.freeze() and destructuring or Lodash `cloneDeep` might be better choices.
* Complexity: For simple objects with few properties, JSON.parse(JSON.stringify) might be sufficient. However, for complex objects with many properties or circular references, a more robust method like Lodash `cloneDeep` or the custom deep clone function (deepClone) is recommended.
* Library dependencies: If you need to use a library that provides a deep copy implementation, consider the trade-offs between using an external library and the potential performance benefits.

**Alternative Approaches:**

Other methods for creating deep copies in JavaScript include:

* `Array.prototype.slice()`: Creates a shallow copy of arrays by creating a new array with references to the original elements.
* `Array.prototype.map()` or `Array.prototype.forEach()`: Can be used to create a deep copy of arrays by mapping over the original array and cloning each element.
* Using `JSON.parse(JSON.stringify)` with `replacer` function: Allows for more control over the copying process, including handling circular references.

However, these alternative approaches may not be as efficient or reliable as the methods tested in this benchmark.

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:107.0) Gecko/20100101 Firefox/107.0

Browser/OS: Firefox 107 on Ubuntu

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	1091279.8 Ops/sec
Json clone	517982.9 Ops/sec
freeze and destructure	4550596.5 Ops/sec
deepClone	5031897.5 Ops/sec
deepFreeze	1623515.2 Ops/sec

Related benchmarks:

deepclone vs deepfreeze (version: 0)

Comparing performance of: Lodash cloneDeep vs Json clone vs freeze and destructure vs deepClone vs deepFreeze

Created: one year ago by: Guest

Jump to the latest result

Lodash cloneDeep

Json clone

freeze and destructure

deepClone

deepFreeze

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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