Benchmark: object spread vs. Object.assign()

Tests:

object spread
const obj = { a: 1, b: 2, } const arr = [] for (let i = 0; i < 1_00000; i++) { arr.push({ ...obj, c: i }) }
Object.assign()
const obj = { a: 1, b: 2, } const arr = [] for (let i = 0; i < 1_00000; i++) { arr.push(Object.assign({}, obj, { c: i })) }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
object spread
Object.assign()

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.

Let's break down the benchmark and its results.

**Benchmark Definition:**

The benchmark compares two approaches to create an array of objects with a shared base object and additional properties:

1. **Object Spread**: Using the spread operator (`{ ...obj, c: i }`) to create a new object that inherits from `obj` and adds a new property `c` with value `i`.
2. **Object.assign()**: Using the `Object.assign()` method to create a shallow copy of an object (`Object.assign({}, obj, { c: i })`) and then adding a new property `c` with value `i`.

**Options Compared:**

The two options being compared are:

* Object spread (using `{ ...obj, c: i }`)
* Object.assign() (using `Object.assign({}, obj, { c: i })`)

**Pros and Cons of Each Approach:**

1. **Object Spread:**
	* Pros:
		+ More concise and readable syntax.
		+ Can be faster for small objects due to the spread operator's optimized implementation.
	* Cons:
		+ May not work as expected with large or complex objects, as it can create a deep copy of the entire object.
2. **Object.assign():**
	* Pros:
		+ More flexible and robust than object spread, as it allows for arbitrary number of source objects and properties to be added.
		+ Works well with large or complex objects, as it creates a shallow copy of only the desired properties.
	* Cons:
		+ Less concise and less readable syntax compared to object spread.

**Library Usage:**

There is no explicit library usage mentioned in the benchmark definition. However, some browsers may include additional libraries or extensions that could affect the results (e.g., some browsers might use a more efficient implementation of `Object.assign()`).

**Special JS Features or Syntax:**

* **Spread Operator (`{ ...obj, c: i }`)**: This syntax was introduced in ECMAScript 2018 (ES2018) as part of the Object Spread and Rest Property expressions. It allows for creating a new object with some properties inherited from an existing object.
* **Object.assign()**: This method has been part of JavaScript since its early versions (ECMAScript 2009). It creates a shallow copy of an object.

**Other Alternatives:**

Alternative approaches to create an array of objects with a shared base object and additional properties include:

1. Using `Array.prototype.map()` with the spread operator (`arr.push({ ...obj, c: i })`)
2. Using `Array.prototype.map()` without the spread operator (i.e., creating a new object using the literal syntax `{ ...obj, c: i }` and then adding it to the array)

Keep in mind that these alternatives may have different performance characteristics or trade-offs compared to the original benchmark options.

**Benchmark Results:**

The latest benchmark results show:

* **Object.assign()**: 23.70 executions per second (FPS) on a Chrome 114 browser on a Windows desktop.
* **object spread**: 14.87 FPS on the same setup.

These results suggest that object assign might be slightly faster in this particular benchmark, but it's essential to note that performance can vary depending on the specific use case and environment.

Related benchmarks:

object spread vs. Object.assign() (version: 0)

Comparing performance of: object spread vs Object.assign()

Created: 2 years ago by: Registered User

Jump to the latest result

object spread

Object.assign()

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