Benchmark: Object Assign / Lodash cloneDeep / JSON Clone

HTML Preparation code:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
<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 myCopy = null;

Tests:

Lodash cloneDeep
myCopy = _.cloneDeep(MyObject);
Json clone
myCopy = JSON.parse(JSON.stringify(MyObject));
Object assign
Object.assign(myCopy, MyObject);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Json clone
Object assign

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 120 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	1741339.2 Ops/sec
Json clone	1041543.3 Ops/sec
Object assign	7241460.5 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 three different approaches for creating a copy of an object in JavaScript:

1. Lodash's `cloneDeep` method
2. The built-in `JSON.parse(JSON.stringify())` method
3. The `Object.assign()` method

These methods are compared to determine which one is the fastest.

**Options Compared**

The options being compared are:

* **Lodash cloneDeep**: A function from the Lodash library that creates a deep copy of an object.
	+ Pros: Provides a reliable way to create a deep copy, handles complex data structures like arrays and objects with circular references.
	+ Cons: Requires an additional dependency (Lodash) and may have a higher overhead due to its functionality.
* **JSON.parse(JSON.stringify())**: A built-in JavaScript method that parses a JSON string into a JavaScript object. It can be used to create a copy of an object by converting the original object to a string, parsing it back to an object, and then assigning it to a new variable.
	+ Pros: Lightweight and doesn't require any additional dependencies. However, it may not work correctly for all types of objects or data structures (e.g., objects with circular references).
* **Object.assign()**: A built-in JavaScript method that copies the values of all enumerable own properties from one or more source objects to a target object.
	+ Pros: Lightweight and doesn't require any additional dependencies. It's also relatively fast compared to `JSON.parse(JSON.stringify())`.
	+ Cons: May not work correctly for all types of data structures (e.g., arrays, objects with circular references).

**Library - Lodash**

Lodash is a popular JavaScript utility library that provides a wide range of functions for tasks like array manipulation, object creation, and more. The `cloneDeep` method is one of its many functions designed to create deep copies of objects.

**Special JS Feature/Syntax**

The benchmark uses the `JSON.stringify()` and `JSON.parse()` methods, which are built-in JavaScript features that convert a JavaScript value to a JSON string and vice versa. These methods are used to test the performance of creating a copy of an object using these approaches.

**Benchmark Preparation Code**

The preparation code for each benchmark creates an object (`MyObject`) with nested properties and sets up two variables: `myCopy` (the target variable that will receive the copied object) and `null` (initially, it's set to null).

**Individual Test Cases**

Each test case is defined by a single line of JavaScript code that assigns one of the three methods to create a copy of the original object (`MyObject`) into the `myCopy` variable. The `Test Name` field indicates which method is being tested.

The latest benchmark results show that:

* **Lodash cloneDeep**: 1741339.25 executions per second
* **JSON.parse(JSON.stringify())**: 1041543.3125 executions per second
* **Object.assign()**: 7241460.5 executions per second

This suggests that `Object.assign()` is the fastest approach, followed by Lodash's `cloneDeep` method and then `JSON.parse(JSON.stringify())`.

**Other Alternatives**

If you need to create a copy of an object in JavaScript, other alternatives you might consider include:

* Using a library like Immutable.js or deepcopy
* Using a custom implementation with recursion or iteration
* Using a framework-specific solution (e.g., React's `useMemo` hook)

However, keep in mind that performance may vary depending on the specific use case and data structure.

Related benchmarks:

Object Assign / Lodash cloneDeep / JSON Clone (version: 0)

Comparing performance of: Lodash cloneDeep vs Json clone vs Object assign

Created: 3 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Json clone

Object assign

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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