Benchmark: Delete vs destructure for objects without mutating

Script Preparation code:

var obj = {
  a:1,
  b:2,
  c:3
}

Tests:

delete - assign
const copy = Object.assign({}, obj); delete obj.a
Rest object
const { a, ...rest } = obj;
delete - spread operator
const copy = { ...obj } delete obj.a
delete - JSON.stringify
const copy = JSON.parse(JSON.stringify(obj)); delete obj.a

Historical Performance Data aggregated from 90 community runs

Desktop Results:

Chrome 71 runs

delete - spread operator

3.2M/s

Rest object

2.9M/s

delete - assign

2.5M/s

delete - JSON.stringify

1.8M/s

Fastest: delete - spread operator (1.7x faster)

View exact numbers

✓ delete - spread operator: 3,169,403 ops/sec
• Rest object: 2,917,830 ops/sec
• delete - assign: 2,491,812 ops/sec
• delete - JSON.stringify: 1,837,222 ops/sec

Firefox 12 runs

Rest object

14.6M/s

delete - spread operator

14.0M/s

delete - assign

13.7M/s

delete - JSON.stringify

2.9M/s

Fastest: Rest object (5.0x faster)

View exact numbers

✓ Rest object: 14,575,406 ops/sec
• delete - spread operator: 13,966,637 ops/sec
• delete - assign: 13,721,238 ops/sec
• delete - JSON.stringify: 2,943,298 ops/sec

Mobile Results:

Chrome 7 runs

delete - spread operator

1.8M/s

Rest object

1.8M/s

delete - assign

1.3M/s

delete - JSON.stringify

1.3M/s

Fastest: delete - spread operator (1.4x faster)

View exact numbers

✓ delete - spread operator: 1,831,268 ops/sec
• Rest object: 1,768,203 ops/sec
• delete - assign: 1,341,436 ops/sec
• delete - JSON.stringify: 1,337,332 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
delete - assign
Rest object
delete - spread operator
delete - JSON.stringify

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 19 days ago)

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

Browser/OS: Chrome 148 on Mac OS X 10.15.7

View result in a separate tab

delete - spread operator

5.7M/s

Rest object

4.7M/s

delete - assign

4.6M/s

delete - JSON.stringify

3.8M/s

View exact numbers

Test name	Executions per second
✓ delete - spread operator	5,693,924 Ops/sec
Rest object	4,741,289 Ops/sec
delete - assign	4,589,878 Ops/sec
delete - JSON.stringify	3,750,819 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into explaining the provided benchmark.

**Benchmark Overview**

The benchmark, titled "Delete vs destructure for objects without mutating," compares the performance of different approaches to delete properties from an object without modifying the original object. The test cases are designed to measure the execution speed of each approach.

**Options Compared**

There are four options compared in this benchmark:

1. **delete obj.a**: This approach uses the `delete` operator to remove the property `a` from the object `obj`.
2. **const { a, ...rest } = obj;**: This approach uses destructuring assignment to extract the value of `a` from the object `obj` and assign it to a new variable `a`, while also creating a new object `rest` that includes all properties except `a`. The original object `obj` remains unchanged.
3. **const copy = { ...obj }; delete obj.a;**: This approach uses the spread operator to create a shallow copy of the object `obj`, and then deletes the property `a` from the copied object.
4. **const copy = JSON.parse(JSON.stringify(obj)); delete obj.a;**: This approach uses `JSON.stringify()` to serialize the object `obj` to a string, creates a new object `copy` by parsing the serialized string back to an object, and then deletes the property `a` from the copied object.

**Pros and Cons of Each Approach**

1. **delete obj.a**:
	* Pros: Simple and straightforward.
	* Cons: Can be slower than other approaches because it modifies the original object's internal data structure (the hash table).
2. **const { a, ...rest } = obj;**:
	* Pros: Efficient and doesn't modify the original object. Creates a new object with only the desired properties.
	* Cons: Requires using destructuring assignment, which can be less familiar to some developers.
3. **const copy = { ...obj }; delete obj.a;**:
	* Pros: Creates a shallow copy of the object, and then deletes the property, avoiding modifying the original object's internal data structure.
	* Cons: Can still be slower than other approaches because it creates an additional copy of the object.
4. **const copy = JSON.parse(JSON.stringify(obj)); delete obj.a;**:
	* Pros: Creates a deep copy of the object by serializing and deserializing it, which can be useful for complex objects with nested properties.
	* Cons: Can be slower than other approaches because it creates an additional copy of the object. Also requires using `JSON.stringify()` and `JSON.parse()`, which can be expensive operations.

**Library Used**

In this benchmark, no external libraries are used explicitly, but `JSON` is used implicitly for serializing and deserializing objects.

**Special JS Features or Syntax**

The following special JavaScript features or syntax are used in the benchmark:

* **Destructuring assignment**: Used in option 2 to extract properties from an object.
* **Spread operator**: Used in option 3 to create a shallow copy of an object.
* **JSON.stringify() and JSON.parse()**: Used in options 4 to serialize and deserialize objects, respectively.

**Other Considerations**

The benchmark is designed to measure the performance of each approach on different browsers and devices. The results can help developers understand which approach is most efficient for their use case.

Other alternatives that could be explored include:

* Using a library like Lodash's `omit()` function or the `deleteProperty()` method from some JavaScript engines.
* Comparing the performance of these approaches with other ways to remove properties, such as using the `Object.keys()` and `splice()` methods.

Delete vs destructure for objects without mutating (version: 0)

Measure the performance of delete versus removing a prop from an object without mutating

Comparing performance of: `delete - assign vs Rest object vs delete - spread operator vs delete - JSON.stringify`

Created: 5 years ago by: Registered User

Go to the latest result

delete - assign

Rest object

delete - spread operator

delete - JSON.stringify

Historical Performance Data aggregated from 90 community runs

Desktop Results:

Chrome 71 runs

Firefox 12 runs

Mobile Results:

Chrome 7 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Delete vs destructure for objects without mutating (version: 0)

Measure the performance of delete versus removing a prop from an object without mutating

Comparing performance of: delete - assign vs Rest object vs delete - spread operator vs delete - JSON.stringify

Created: 5 years ago by: Registered User

Go to the latest result

delete - assign

Rest object

delete - spread operator

delete - JSON.stringify

Historical Performance Data aggregated from 90 community runs

Desktop Results:

Chrome 71 runs

Firefox 12 runs

Mobile Results:

Chrome 7 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: `delete - assign vs Rest object vs delete - spread operator vs delete - JSON.stringify`