Benchmark: Object.defineProperty vs Object.assign vs Object spread

Script Preparation code:

var input = new Array(100).fill().map((v, i) => i)

Tests:

Object.defineProperty
const output = input.reduce((acc, value) => Object.defineProperty(acc, `key${value}`, { value }), {});
Object spread
const output = input.reduce((acc, value) => ({ ...acc, [`key${value}`]: value }));
Object.assign (mutable)
const output = input.reduce((acc, value) => Object.assign(acc, { [`key${value}`]: value }), {});

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 runs

Object.defineProperty

41K/s

Object.assign (mutable)

41K/s

Object spread

8K/s

Fastest: Object.defineProperty (5.3x faster)

View exact numbers

✓ Object.defineProperty: 41,305 ops/sec
• Object.assign (mutable): 40,634 ops/sec
• Object spread: 7,841 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.defineProperty
Object spread
Object.assign (mutable)

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Safari/537.36

Browser/OS: Chrome 128 on Windows

View result in a separate tab

Object.defineProperty

33K/s

Object.assign (mutable)

31K/s

Object spread

9K/s

View exact numbers

Test name	Executions per second
✓ Object.defineProperty	33,152 Ops/sec
Object.assign (mutable)	31,284 Ops/sec
Object spread	8,546 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

The provided JSON represents a benchmark test case comparing three different approaches to define properties on an object:

1.  **`Object.defineProperty()`**: This method is used to dynamically add or modify own enumerable properties on an object. It returns `undefined` and throws no error if successful.
2.  **`Object.assign()`** (with a mutable approach): The standard JavaScript method for copying properties from one or more source objects to a target object. However, when using it with multiple sources, it creates a new object instead of modifying the existing one. This is why we have an additional version labeled as "mutable".
3.  **`Object spread operator (`)**: Also known as the shorthand property assignment syntax, this allows you to copy properties from one or more source objects to a target object.

**Options Comparison:**

Here's a comparison of these three approaches:

**Pros and Cons:**

*   **`Object.defineProperty()`**: Pros:
    *   Faster
    *   More control over property descriptors
    *   Suitable for use cases requiring deep property modification

Cons:
    *   Less readable code due to verbose syntax
*   **`Object.assign()` (mutable)**: Pros:
    *   Easier to read and write than Object.defineProperty()
    *   Less error-prone, as it creates a new object instead of modifying an existing one

Cons:
    *   Slower than `Object.defineProperty()`
    *   Unintended behavior if used with multiple sources
*   **`Object spread operator (`)`**: Pros:
    *   Fast and efficient
    *   More concise code compared to Object.defineProperty()
    *   Suitable for shallow property modifications

Cons:
    *   Less readable code than `Object.assign()`
    *   Not suitable for deep property modification

**Other Considerations:**

*   **ES6 syntax**: The object spread operator was introduced in ECMAScript 2015, while Object.defineProperty() and Object.assign() have been part of the standard JavaScript specification since ES3.
*   **Browser compatibility**: Although these methods are widely supported, it's essential to ensure compatibility with older browsers, especially when using `Object.defineProperty()` or `Object.assign()`.

**Library:**

None

**Special JS feature or syntax:** None mentioned in the provided code.

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

Comparing performance of: `Object.defineProperty vs Object spread vs Object.assign (mutable)`

Created: 4 years ago by: Guest

Go to the latest result

Object.defineProperty

Object spread

Object.assign (mutable)

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

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

Comparing performance of: Object.defineProperty vs Object spread vs Object.assign (mutable)

Created: 4 years ago by: Guest

Go to the latest result

Object.defineProperty

Object spread

Object.assign (mutable)

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `Object.defineProperty vs Object spread vs Object.assign (mutable)`