Benchmark: object spread vs immutable-js setIn vs mori hashmap vs immer

HTML Preparation code:

<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/3.8.2/immutable.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/immutability-helper@2.7.0/index.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mori/0.3.2/mori.min.js"></script>
<script src="https://unpkg.com/immer@6.0.3/dist/immer.umd.production.min.js"></script>

Tests:

object spread
let obj = {sub: {}}; for(i=0;i<100;i++){ const key = 'key'+i const value = 'value'+i obj = {...obj, sub: { ...obj.sub, [key]: {key, value} }} }
immutable-js
let obj = Immutable.fromJS({a: {}}); for(i=0;i<100;i++){ const key = 'key'+i const value = 'value'+i obj = obj.setIn(['a', key], {key, value}) }
mori
let hm = mori.hashMap(); hm = mori.assoc.f3(hm, "a", mori.hashMap()); for(i=0;i<100;i++){ const key = 'key'+i const value = 'value'+i hm = mori.assoc.f3( hm, "a", mori.assoc.f3(mori.get(hm, "a", mori.hashMap()), key, {key, value}) ) }
immer
let state = {sub: {}};; for(i=0;i<100;i++){ const key = 'key'+i const value = 'value'+i state = immer.produce(state, draft => { state.sub[key] = {key, value} }) }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
object spread
immutable-js
mori
immer

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/605.1.15 (KHTML, like Gecko) Version/16.6 Safari/605.1.15

Browser/OS: Safari 16 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
object spread	8326.7 Ops/sec
immutable-js	29645.2 Ops/sec
mori	15538.1 Ops/sec
immer	21861.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and its test cases.

**Benchmark Overview**

The benchmark is designed to compare the performance of four different approaches for updating an object's nested structure:

1. Object Spread (`object spread`)
2. Immutable.js Set In (`immutable-js`)
3. Mori Hashmap (`mori`)
4. Immer (`immer`)

**Test Cases**

Each test case measures the performance of a specific approach, and they share some similarities:

* They start with an initial object structure (`obj`, `hm`, or `state`) that is updated repeatedly.
* Each iteration, a new key-value pair is added to the object using a different method (object spread, immutable.js Set In, mori association, or immer produce).
* The test case measures the execution frequency per second.

**Options Compared**

The four options being compared are:

1. **Object Spread**: Uses the spread operator (`...`) to create a new object with updated properties.
	* Pros: Simple and widely supported in modern browsers. No external dependencies required.
	* Cons: Can lead to slower performance due to object creation overhead.
2. **Immutable.js Set In**: Uses Immutable.js's `setIn` method to update an existing immutable object.
	* Pros: Ensures immutability, reducing side effects and making it easier to reason about code. Can provide better performance due to lazy evaluation.
	* Cons: Requires additional dependencies (Immutable.js) and can be overkill for simple use cases.
3. **Mori Hashmap**: Uses Mori's hashmap data structure to update values in a nested object.
	* Pros: Provides an efficient way to update nested objects with minimal overhead. No external dependencies required.
	* Cons: Less familiar than other options, requiring more code to set up and use.
4. **Immer**: Uses Immer's `produce` method to create a new immutable copy of the original object and then updates it.
	* Pros: Ensures immutability and provides better performance due to lazy evaluation. Supports nested objects natively.
	* Cons: Requires additional dependencies (Immer) and can be overkill for simple use cases.

**Library Overview**

The benchmark uses the following libraries:

1. Immutable.js: A popular library for functional programming and immutability in JavaScript. Used for the `immutable-js` test case.
2. Immutability-helper: A utility library that provides a set of functions to work with immutable objects, including the `setIn` method. Used for the `immutable-js` test case.
3. Mori: A lightweight data structure library that provides a hashmap implementation. Used for the `mori` test case.
4. Immer: A library that provides a simple and efficient way to create immutable copies of objects.

**Special JS Feature or Syntax**

None of the libraries used in this benchmark rely on special JavaScript features or syntax beyond standard ECMAScript 6+ support.

**Other Alternatives**

If you're looking for alternatives to these libraries, consider:

1. Lodash: A popular utility library that includes functions for working with objects and arrays.
2. Ramda: A functional programming library that provides a set of predictable, type-safe functions for working with data.
3. Preact: A lightweight alternative to React that provides a set of APIs for building user interfaces.

Keep in mind that each alternative has its own strengths and weaknesses, and the choice ultimately depends on your specific use case and requirements.

Related benchmarks:

object spread vs immutable-js setIn vs mori hashmap vs immer (version: 0)

Comparing performance of: object spread vs immutable-js vs mori vs immer

Created: one year ago by: Guest

Jump to the latest result

object spread

immutable-js

mori

immer

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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