Benchmark: immer produce vs immer freeze vs immutable copy vs deep freeze vs baseline copy / freeze

HTML Preparation code:

<script src="https://cdnjs.cloudflare.com/ajax/libs/immer/8.0.1/immer.umd.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/3.8.2/immutable.min.js"></script>

Script Preparation code:

// var { compose, over, set, lensPath, append } = R

var INITIAL_DATA = { items: {}, count: 0, keys: [] }

for (var index = 0; index < 100; index++) {
  INITIAL_DATA[index] = { id: index, name: `ITEM-${index}`, value: Math.random() }
  INITIAL_DATA.count++
  INITIAL_DATA.keys.push(index)
}

var mutable = INITIAL_DATA

var NEW_ITEM_ID = INITIAL_DATA.count +1

function deepFreeze (o) {
  Object.freeze(o);

  Object.getOwnPropertyNames(o).forEach(function (prop) {
    if (o.hasOwnProperty(prop)
    && o[prop] !== null
    && (typeof o[prop] === "object" || typeof o[prop] === "function")
    && !Object.isFrozen(o[prop])) {
      deepFreeze(o[prop]);
    }
  });
  
  return o;
};

Tests:

immer produce
data = immer.produce(INITIAL_DATA, draft => {})
immer freeze
data = immer.freeze(INITIAL_DATA, draft => {})
immutable copy
data = Immutable.fromJS(INITIAL_DATA)
deep freeze
data = deepFreeze(INITIAL_DATA)
baseline copy / freeze
data = Object.freeze({ items: Object.freeze({ ...INITIAL_DATA.items }), count: INITIAL_DATA.count, keys: Object.freeze([ ...INITIAL_DATA.keys ]) })

Historical Performance Data aggregated from 9 community runs

Desktop Results:

Chrome 9 runs

immer freeze

8.1M/s

baseline copy / freeze

3.7M/s

immer produce

3.0M/s

deep freeze

163K/s

immutable copy

30K/s

Fastest: immer freeze (271.2x faster)

View exact numbers

✓ immer freeze: 8,117,907 ops/sec
• baseline copy / freeze: 3,746,040 ops/sec
• immer produce: 2,986,304 ops/sec
• deep freeze: 162,788 ops/sec
• immutable copy: 29,933 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
immer produce
immer freeze
immutable copy
deep freeze
baseline copy / freeze

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 134 on Mac OS X 10.15.7

View result in a separate tab

immer freeze

16.3M/s

baseline copy / freeze

7.8M/s

immer produce

6.3M/s

deep freeze

304K/s

immutable copy

46K/s

View exact numbers

Test name	Executions per second
✓ immer freeze	16,336,247 Ops/sec
baseline copy / freeze	7,753,980 Ops/sec
immer produce	6,269,420 Ops/sec
deep freeze	304,414 Ops/sec
immutable copy	45,754 Ops/sec

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 on the provided JSON.

**Benchmark Overview**

The benchmark is designed to compare different approaches for freezing or copying an object in JavaScript. The test data consists of a large object `INITIAL_DATA` with 100 properties, each containing an `id`, `name`, and `value`. The benchmark compares five different methods:

1. `immer.produce`
2. `immer.freeze`
3. `Immutable.fromJS`
4. `deepFreeze`
5. A baseline approach using `Object.freeze`

**Options Compared**

Here's a brief description of each option:

* **`immer.produce`**: Produces a new immutable object by applying the provided function to the original data.
* **`immer.freeze`**: Freezes the original object in place, making it immutable.
* **`Immutable.fromJS`**: Creates an immutable JavaScript object from a JSON-like object (in this case, `INITIAL_DATA`).
* **`deepFreeze`**: A recursive function that freezes all nested properties of an object.
* **Baseline copy / freeze**: Uses `Object.freeze` to freeze the entire object, including its properties.

**Pros and Cons**

Here's a brief summary of each approach:

* **`immer.produce`**:
	+ Pros: Creates a new immutable object, efficient for large data sets.
	+ Cons: Can be slower than other approaches due to the overhead of creating a new object.
* **`immer.freeze`**:
	+ Pros: Efficiently freezes the original object in place.
	+ Cons: Does not create a new object; modifying the frozen object can lead to unexpected behavior.
* **`Immutable.fromJS`**:
	+ Pros: Creates an immutable object from a JSON-like object, easy to use.
	+ Cons: Can be slower than `immer.freeze` due to the overhead of creating a new object.
* **`deepFreeze`**:
	+ Pros: Recursively freezes all nested properties of an object.
	+ Cons: Can lead to unexpected behavior if not used carefully, as it modifies the original object.
* **Baseline copy / freeze**:
	+ Pros: Creates a new immutable object by freezing its properties.
	+ Cons: Can be slower than other approaches due to the overhead of creating a new object.

**Other Considerations**

When choosing an approach, consider the following factors:

* Performance: If speed is critical, `immer.freeze` or `Immutable.fromJS` might be a good choice.
* Mutability: If you need to modify the frozen object, `immer.produce` or baseline copy / freeze might be more suitable.
* Complexity: If you're dealing with nested objects, `deepFreeze` can be a convenient option.

**Library and Purpose**

In this benchmark, two libraries are used:

1. **Immer**: A library for working with immutable data structures in JavaScript. Its main purpose is to provide an efficient way to create new immutable objects from existing ones.
2. **Immutable**: Another library that provides immutable data structures for JavaScript. Its main purpose is to build upon Immer's functionality and offer more advanced features.

**Special JS Feature or Syntax**

There is no special JavaScript feature or syntax used in this benchmark. The focus is on comparing different approaches for freezing or copying objects, which are fundamental concepts in JavaScript.

immer produce vs immer freeze vs immutable copy vs deep freeze vs baseline copy / freeze (version: 1) Benchmark.js

Comparing performance of: `immer produce vs immer freeze vs immutable copy vs deep freeze vs baseline copy / freeze`

Created: 4 years ago by: Registered User

Go to the latest result

immer produce

immer freeze

immutable copy

deep freeze

baseline copy / freeze

Historical Performance Data aggregated from 9 community runs

Desktop Results:

Chrome 9 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

immer produce vs immer freeze vs immutable copy vs deep freeze vs baseline copy / freeze (version: 1) Benchmark.js

Comparing performance of: immer produce vs immer freeze vs immutable copy vs deep freeze vs baseline copy / freeze

Created: 4 years ago by: Registered User

Go to the latest result

immer produce

immer freeze

immutable copy

deep freeze

baseline copy / freeze

Historical Performance Data aggregated from 9 community runs

Desktop Results:

Chrome 9 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `immer produce vs immer freeze vs immutable copy vs deep freeze vs baseline copy / freeze`