Benchmark: Object spread, object assign

Script Preparation code:

var test1 = { a: 1, b: 2, c: 3 };
var test2 = { d: 4, e: 5, f: 6 };

Tests:

Assign spread
const assignSpread = { ...test1, ...test2 };
Assign mutate
const assignMutate = Object.assign(test1, test2);
Assign Immutable
const assignImmutable = Object.assign({}, test1, test2);
Copy spread
const copySpread = { ...test1 };
Copy assign
const copyAssign = Object.assign({}, test1);
assign spread inline
const assignSpreadInline = { ...test1, x: 1 };
assign inline mutate
const assignInlineMutate = Object.assign(test1, { x: 1 });
assign inline copy
const assignInlineCopy = Object.assign({}, test1, { x: 1 });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Assign spread
Assign mutate
Assign Immutable
Copy spread
Copy assign
assign spread inline
assign inline mutate
assign inline copy

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 87 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Assign spread	433354.0 Ops/sec
Assign mutate	2526856.0 Ops/sec
Assign Immutable	1794185.1 Ops/sec
Copy spread	8966020.0 Ops/sec
Copy assign	2448191.0 Ops/sec
assign spread inline	1179124.8 Ops/sec
assign inline mutate	3629800.5 Ops/sec
assign inline copy	2076535.0 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 Definition**

The benchmark is designed to measure the performance of different approaches for assigning or spreading objects in JavaScript. Specifically, it tests the execution time of various methods:

1. Object spread (`{ ...test1, ...test2 }`)
2. Object assignment (`Object.assign(test1, test2)`)
3. Immutable object creation (`Object.assign({}, test1, test2)`)
4. Copying an object using spread (`{ ...test1 }`)
5. Copying an object using assignment (`Object.assign({}, test1)`)
6. Assigning a value to an existing object using inline spread (`{ ...test1, x: 1 }`)
7. Assigning a value to an existing object using inline mutation (`Object.assign(test1, { x: 1 })`)
8. Assigning a value to an existing object using inline copying (`Object.assign({}, test1, { x: 1 })`)

**Options Compared**

The benchmark compares the performance of different approaches for assigning or spreading objects:

* Object spread vs. Object assignment
* Immutable object creation vs. regular object assignment
* Copying an object using spread vs. copying an object using assignment
* Assigning a value to an existing object using inline spread vs. assigning a value to an existing object using inline mutation or copying

**Pros and Cons of Each Approach**

Here's a brief overview of the pros and cons of each approach:

1. Object Spread:
	* Pros: concise, readable, and efficient
	* Cons: may be slower than other methods for large objects due to the need to create a new object
2. Object Assignment:
	* Pros: flexible, can assign multiple values at once, and supports mutating existing objects
	* Cons: may be less readable than object spread, especially for complex assignments
3. Immutable Object Creation:
	* Pros: ensures that original data remains unchanged, and can be useful for predictable performance
	* Cons: creates a new object every time, which can lead to increased memory usage
4. Copying an Object using Spread:
	* Pros: concise and readable, similar to object spread but with a different approach
	* Cons: may not be as efficient as object assignment for large objects
5. Copying an Object using Assignment:
	* Pros: flexible and can assign multiple values at once, similar to object assignment
	* Cons: creates a new object every time, which can lead to increased memory usage

**Library Used**

The benchmark uses the `Object` class, which is a built-in JavaScript library. The `Object.assign()` method is also used, which is part of the same library.

**Special JS Features/Syntax**

This benchmark does not use any special JavaScript features or syntax beyond what's normally available in modern JavaScript engines. However, it's worth noting that some versions of Internet Explorer may have issues with certain aspects of object assignment or spread.

**Conclusion**

The benchmark provides a useful insight into the performance differences between various approaches for assigning or spreading objects in JavaScript. By understanding these trade-offs, developers can choose the most suitable approach for their specific use cases and optimize their code accordingly.

Related benchmarks:

Object spread, object assign (version: 0)

Comparing performance of: Assign spread vs Assign mutate vs Assign Immutable vs Copy spread vs Copy assign vs assign spread inline vs assign inline mutate vs assign inline copy

Created: 4 years ago by: Guest

Jump to the latest result

Assign spread

Assign mutate

Assign Immutable

Copy spread

Copy assign

assign spread inline

assign inline mutate

assign inline copy

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