Benchmark: Object.assign vs mutation

Script Preparation code:

var translations = {foo: 'bar'};

Tests:

Object.assign without creating new obj
Object.assign(translations, {'loading': 'Loading'});
mutation
translations.loading = 'Loading';

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.assign without creating new obj
mutation

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/114.0.0.0 Safari/537.36

Browser/OS: Chrome 114 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Object.assign without creating new obj	9064006.0 Ops/sec
mutation	28534984.0 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 definition and test cases.

**What is tested?**

The benchmark compares two approaches:

1. **Mutation**: In this approach, the original object `translations` is modified directly by assigning a new value to one of its properties (`loading = 'Loading'`). This is equivalent to changing the original data.
2. **Object.assign without creating a new object**: In this approach, `Object.assign()` is used to create a shallow copy of the `translations` object and then assign a new value to the `loading` property on the resulting object.

**Options compared**

The two approaches have different implications for performance, memory usage, and code readability:

* **Mutation**:
	+ Pros: Generally faster, as it avoids creating a new object.
	+ Cons: Can lead to unexpected side effects if the original data is modified unexpectedly. Also, modern browsers may optimize this approach, making it faster.
	+ Considerations: This approach can be convenient when working with immutable objects or when the modification is intended to be temporary.
* **Object.assign without creating a new object**:
	+ Pros: More explicit and predictable behavior, as it creates a new object that is independent of the original data. Can also help prevent unintended side effects.
	+ Cons: May be slower due to the overhead of creating a new object and copying its properties.

**Library usage**

There is no library mentioned in the provided benchmark definition or test cases. The `Object.assign()` method is a built-in JavaScript function.

**Special JS feature or syntax**

The benchmark does not use any special JavaScript features or syntax, such as async/await, promises, or modern language features like nullish coalescing (`??`).

**Other alternatives**

Alternative approaches to compare in this benchmark could be:

* **Object.create()**: Instead of using `Object.assign()`, you could create a new object with the same prototype as `translations` and then assign values to its properties. This approach would create a new object but might have similar performance characteristics to mutation.
* **Array.prototype.map()` or other array methods**: If working with arrays, you could use an array method like `map()` or `forEach()` to create a new array or perform some operation on the original data.

Overall, this benchmark provides a simple and clear comparison between two approaches that are commonly used in JavaScript programming.

Related benchmarks:

Object.assign vs mutation (version: 0)

Comparing performance of: Object.assign without creating new obj vs mutation

Created: one year ago by: Guest

Jump to the latest result

Object.assign without creating new obj

mutation

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