Benchmark: object spread vs object assign immutable vs object assign mutate

Tests:

Using the spread operator
const firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } const finalObject = Object.assign({ ...firstObject, ...secondObject });
Using Object.assign immutable
const firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } const finalObject = Object.assign({}, firstObject, secondObject);
Using Object.assign mutate
const firstObject = { sampleData: 'Hello world' } const secondObject = { moreData: 'foo bar' } const finalObject = Object.assign(firstObject, secondObject);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Using the spread operator
Using Object.assign immutable
Using Object.assign mutate

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided benchmark measures the performance of three different approaches to merge two objects in JavaScript: using the spread operator (`...`), using `Object.assign` with an immutable object, and using `Object.assign` with a mutable object.

**Test Cases**

There are three test cases:

1. **Using the Spread Operator**: This test case uses the spread operator (`...`) to merge two objects.
   ```javascript
const firstObject = { sampleData: 'Hello world' }
const secondObject = { moreData: 'foo bar' }
const finalObject = Object.assign({}, ...[firstObject, secondObject])
```
   Pros:

* This approach is concise and easy to read.
   * It creates a new object without modifying the original objects.

Cons:

* Performance might be slower due to the creation of a new object.
2. **Using `Object.assign` with Immutable Object**: This test case uses `Object.assign()` with an empty immutable object (`{}`) to merge two objects.
   ```javascript
const firstObject = { sampleData: 'Hello world' }
const secondObject = { moreData: 'foo bar' }
const finalObject = Object.assign({}, firstObject, secondObject)
```
   Pros:

* Performance might be faster since it modifies an existing object without creating a new one.
   * This approach preserves the original objects.

Cons:

* It's slightly less readable due to the use of `Object.assign()` with an immutable object.
3. **Using `Object.assign` with Mutable Object**: This test case uses `Object.assign()` directly on the second object (`secondObject`) without creating a new object or using an immutable object.
   ```javascript
const firstObject = { sampleData: 'Hello world' }
const secondObject = { moreData: 'foo bar' }
const finalObject = Object.assign(secondObject, firstObject)
```
   Pros:

* Performance might be the fastest since it modifies the existing mutable object directly.

Cons:

* It's less readable due to the direct modification of an object.
   * This approach can lead to unintended side effects if used carelessly.

**Other Considerations**

When choosing between these approaches, consider the trade-offs in terms of readability, performance, and potential side effects. In general, using the spread operator is a good choice for most use cases due to its conciseness and readability.

If you need to preserve the original objects or want better performance, using `Object.assign` with an immutable object might be a better option. However, if you're willing to sacrifice some readability in exchange for potential performance gains, directly modifying a mutable object is another viable approach.

**Library/Functions Used**

The benchmark uses the following JavaScript functions/libraries:

*   `Object.assign()`: A built-in function for merging objects.
*   Spread operator (`...`): A feature introduced in ECMAScript 2015 (ES6) for creating new objects from existing ones.

These libraries/functions are widely supported across modern browsers and Node.js environments.

Related benchmarks:

object spread vs object assign immutable vs object assign mutate (version: 0)

Comparing performance of: Using the spread operator vs Using Object.assign immutable vs Using Object.assign mutate

Created: 3 years ago by: Guest

Jump to the latest result

Using the spread operator

Using Object.assign immutable

Using Object.assign mutate

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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