Benchmark: object spread vs immutable-js set2

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>

Tests:

object spread set
let obj = {}; for(i=0;i<1000;i++){ const key = 'key'+i const value = 'value'+i obj = {...obj, [key]: {key, value}} }
immutable-js set
let obj = Immutable.Map(); for(i=0;i<1000;i++){ const key = 'key'+i const value = 'value'+i obj = obj.set(key, {key, value}) }
object spread set + get
let obj = {}; let v = null for(i=0;i<1000;i++){ const key = 'key'+i const value = 'value'+i obj = {...obj, [key]: {key, value}} } for(i=0;i<1000;i++){ const key = 'key'+i v = obj[key] }
immutable-js set + get
let obj = Immutable.Map(); let v = null for(i=0;i<1000;i++){ const key = 'key'+i const value = 'value'+i obj = obj.set(key, {key, value}) } for(i=0;i<1000;i++){ const key = 'key'+i v = obj.get(key) }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
object spread set
immutable-js set
object spread set + get
immutable-js set + get

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

**What is being tested?**

The provided benchmark measures the performance of two approaches for creating and manipulating objects in JavaScript:

1. **Object Spread**: This method uses the `...` operator to create a new object by spreading an existing object, and then adds new properties to it.
2. **Immutable.js Set**: This method uses the Immutable.js library to create an immutable data structure, specifically a Map (similar to an object in JavaScript), and updates its properties using the `set()` method.

**Options compared**

The benchmark compares two variations of each approach:

* **Object Spread Set**: Creates a new object using object spread and then adds new properties to it.
* **Immutable.js Set**: Creates an immutable map and updates its properties using the `set()` method.
* **Object Spread Set + Get**: Combines both operations: creates a new object, adds properties, and then retrieves values from it.
* **Immutable.js Set + Get**: Combines both operations: creates an immutable map, updates its properties, and then retrieves values from it.

**Pros and Cons**

**Object Spread**

Pros:

* Simple and intuitive syntax
* Fast creation of objects
* Can be used to create immutable objects by creating a new object each time

Cons:

* Does not provide immutability guarantees for large objects or complex data structures
* May lead to performance issues if used with very large objects or frequent updates

**Immutable.js Set**

Pros:

* Provides immutability guarantees for data structures, ensuring consistency and thread-safety
* Can be used to create immutable maps (similar to objects) that can be safely updated without affecting other parts of the application

Cons:

* More complex syntax than object spread
* Requires additional library dependencies
* May have higher performance overhead due to immutability guarantees

**Other considerations**

When choosing between these approaches, consider the following factors:

* **Immutability**: If you need to ensure data consistency and thread-safety, Immutable.js Set might be a better choice. However, if simplicity and fast object creation are more important, Object Spread could be sufficient.
* **Performance**: Both approaches can lead to performance issues if used with very large objects or frequent updates. However, Object Spread is generally faster due to its simpler syntax and lack of immutability guarantees.
* **Code readability**: Object Spread provides a simple and intuitive syntax that many developers are familiar with. Immutable.js Set requires more complex code to ensure proper usage of the library.

**Library: Immutable.js**

Immutable.js is a JavaScript library for creating immutable data structures, such as Maps (similar to objects). It provides a way to create immutable collections that can be safely updated without affecting other parts of the application.

**Special JS feature or syntax**

The benchmark uses the `...` operator for object spread and the `set()` method for Immutable.js Sets. These features are part of modern JavaScript syntax and provide a convenient way to work with objects and data structures.

If you're new to these features, here's a quick summary:

* The `...` operator is used to create a new object by spreading an existing object.
* The `set()` method is used to update the value associated with a key in an Immutable.js Map (similar to an object).

Other alternatives to these approaches include:

* **Lodash**: A popular JavaScript utility library that provides many functions for working with objects and data structures, including ones for object spread and mapping updates.
* **Mongolian**: A JavaScript library that provides immutable data structures similar to Immutable.js Sets.

Keep in mind that these libraries may have different performance characteristics, syntax requirements, and features compared to Object Spread and Immutable.js Set.

Latest run results:

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

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

Browser/OS: Chrome 72 on Windows

View result in a separate tab

Test name	Executions per second
object spread set	3.5 Ops/sec
immutable-js set	783.4 Ops/sec
object spread set + get	3.3 Ops/sec
immutable-js set + get	587.3 Ops/sec

Related benchmarks:

object spread vs immutable-js set2 (version: 0)

Comparing performance of: object spread set vs immutable-js set vs object spread set + get vs immutable-js set + get

Created: 6 years ago by: Guest

Jump to the latest result

object spread set

immutable-js set

object spread set + get

immutable-js set + get

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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