Benchmark: object spread vs immutable-js corrected v2

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
const obj = {}; for(i=0;i<100000;i++){ obj[i] = 'some long string which will need to be copied'; } const obj2 = {key: 'This is final object'} const final = {obj2, ...obj}; for(i=0;i<100000;i++){ final[i] = 'some long string which will need to be copied'; }
immutable-js
const obj = {}; for(i=0;i<100000;i++){ obj[i] = 'some long string which will need to be copied'; } const immObj = Immutable.Map(obj); const obj2 = {key: 'This is final object'} const final = immObj.merge(obj2); for(i=0;i<100000;i++){ final.set(i,'some long string which will need to be copied'); }
No copying
const obj = {key: 'This is final object'}; for(i=0;i<100000;i++){ obj[i] = 'some long string which will need to be copied'; } for(i=0;i<100000;i++){ obj[i] = 'some long string which will need to be copied'; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
object spread
immutable-js
No copying

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 92 on Mac OS X 10.15.3

View result in a separate tab

Test name	Executions per second
object spread	55.4 Ops/sec
immutable-js	11.3 Ops/sec
No copying	491.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

**Benchmark Overview**

The provided JSON represents a benchmark test comparing three approaches:

1. Object Spread (also known as "Shallow Copy" or "Partial Clone")
2. Immutable-js
3. No copying (i.e., modifying the original object directly)

The test creates two objects: an initial object `obj` with 100,000 properties filled with a long string, and a final object `final` that will be created by either spreading the `obj` or merging it with another object.

**Options Compared**

1. **Object Spread**: This approach uses the spread operator (`...`) to create a shallow copy of the `obj`. The resulting `final` object has 100,000 properties filled with the same long string as `obj`.
2. **Immutable-js**: This library provides a way to work with immutable data structures. In this test, it's used to create an Immutable.Map (`immObj`) from the `obj`. Then, the `merge()` method is called to combine `immObj` with another object (`obj2`). The resulting `final` object has 100,000 properties filled with the same long string as `obj`.
3. **No copying**: This approach modifies the original object `obj` directly by assigning new values to its properties.

**Pros and Cons of Each Approach**

1. **Object Spread**:
	* Pros: Fast, efficient, and widely supported.
	* Cons: Can lead to unexpected behavior if not used carefully (e.g., modifying the spread object can affect the original).
2. **Immutable-js**:
	* Pros: Provides a way to work with immutable data structures, which can help prevent side effects in certain situations.
	* Cons: Requires additional setup and library imports, can be slower due to the immutability overhead.
3. **No copying**:
	* Pros: Can be more efficient for small objects or when working with primitive types.
	* Cons: Can lead to unexpected behavior if not used carefully (e.g., modifying the original object can affect other parts of the code).

**Library and Special JS Features**

In this test, Immutable-js is used to create an Immutable.Map (`immObj`) from the `obj`. This allows for immutability and provides a way to merge two objects.

There are no special JavaScript features or syntax being tested in this benchmark. The focus is on the performance differences between these three approaches.

**Other Alternatives**

If you're interested in alternative approaches, here are a few:

1. **Lodash**: Provides a `cloneDeep()` function that creates a deep copy of an object.
2. **Underscore.js**: Offers a `clone()` function that creates a shallow or deep copy of an object, depending on the context.
3. **V8's built-in copying mechanisms**: For certain data types (e.g., strings), V8 provides efficient copying mechanisms that can be used instead of these libraries.

These alternatives may offer better performance or more convenient APIs for specific use cases, but the choice ultimately depends on your project's requirements and constraints.

Related benchmarks:

object spread vs immutable-js corrected v2 (version: 0)

Comparing performance of: object spread vs immutable-js vs No copying

Created: 3 years ago by: Guest

Jump to the latest result

object spread

immutable-js

No copying

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):