Benchmark: Immer(produce) vs lodash(cloneDeep)

HTML Preparation code:

<script src="https://cdn.jsdelivr.net/npm/immer@3.1.3/dist/immer.umd.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

state =  {
    data: {
      data_1: {
        data_1_1: 'data_1_1',
        data_1_2: 'data_1_2'
      },
      data_2: {
        data_2_1: 'data_2_1',
        data_2_2: {
          data_2_2_1: 'value'
        }
      },
    }
  };

Tests:

Immer produce
const result = immer.produce(state, draft => { draft.data.data_1.data_1_1 = 'data_1_1_updated', draft.data.data_2.data_2_2.data_2_2_1 = 'data_2_2_1' })
Lodash clonedeep
const result = _.cloneDeep(state); result.data.data_1.data_1_1 = 'data_1_1_updated'; result.data.data_2.data_2_2.data_2_2_1 = 'data_2_2_1';

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Immer produce
Lodash clonedeep

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 28 days ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/146.0.0.0 Safari/537.36

Browser/OS: Chrome 146 on Windows

View result in a separate tab

Test name	Executions per second
Immer produce	358786.2 Ops/sec
Lodash clonedeep	891929.9 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Explanation**

The provided JSON represents a JavaScript microbenchmark test on MeasureThat.net, comparing the performance of two libraries: Immer and Lodash.

**What is tested?**

The benchmark tests the execution time of two approaches:

1. **Immer's `produce` method**: This method creates a new draft object from an existing state object, allowing for immutable updates to be made on the original state without affecting its original values.
2. **Lodash's `cloneDeep` function**: This function creates a deep copy of an object, which can be used to create a new, independent copy of an existing object.

**Options compared**

The benchmark compares the execution time of these two approaches:

* Immer's `produce` method
* Lodash's `cloneDeep` function

**Pros and Cons**

**Immer's `produce` method:**

Pros:

* Immutable updates, ensuring data integrity and reducing side effects
* Efficient use of resources by only updating specific parts of the state object
* Easier to reason about code with immutable updates

Cons:

* May have a steeper learning curve due to its unique API and concepts (e.g., drafts, actions)
* Can be slower for very large or complex data structures compared to other cloning methods

**Lodash's `cloneDeep` function:**

Pros:

* Easy to understand and use, with a simple API
* Fast execution time for small to medium-sized data structures
* Works well for shallow copying (only copying top-level properties)

Cons:

* Not designed for immutable updates or large-scale data manipulation
* May create unnecessary copies of objects, affecting performance

**Library purpose**

Both Immer and Lodash are popular JavaScript libraries used for various purposes:

* **Immer**: Designed specifically for immutable updates in functional programming. It provides a way to update state without mutating it, making it easier to reason about code and reducing side effects.
* **Lodash**: A general-purpose utility library providing various functions for tasks such as array manipulation, string normalization, and object cloning.

**Special JS feature or syntax**

The benchmark uses the `const` keyword with ES6-style destructuring (e.g., `draft.data.data_1.data_1_1 = 'data_1_1_updated';`) to create a new variable (`draft`) from an existing state object. This is a common pattern in JavaScript, especially when working with functional programming concepts.

**Other alternatives**

For the purpose of this benchmark, the two libraries (Immer and Lodash) are the primary options being compared. However, other cloning methods or approaches might be used in different scenarios:

* **Native JavaScript**: The `Object.assign()` method can be used for simple copying, but it has limitations when dealing with complex data structures.
* **other libraries**: Libraries like **JSONClone**, **copyDeep**, or **json-cloner** provide alternative solutions for deep cloning and copying objects.

Please note that the choice of library or approach depends on the specific requirements of your project, such as performance, readability, and maintainability.

Related benchmarks:

Immer(produce) vs lodash(cloneDeep) (version: 0)

Comparing performance of: Immer produce vs Lodash clonedeep

Created: 3 years ago by: Guest

Jump to the latest result

Immer produce

Lodash clonedeep

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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