Benchmark: Delete vs destructure for objects vs new object

Script Preparation code:

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

Tests:

delete
delete obj.a
Rest object
const { a, ...rest } = obj;
New object
const newObj = { b: obj.b, c: obj.c }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
delete
Rest object
New object

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 17 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

Test name	Executions per second
delete	143811632.0 Ops/sec
Rest object	6234679.0 Ops/sec
New object	86812488.0 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 on MeasureThat.net.

**Benchmark Definition**

The provided JSON represents a benchmark definition for measuring the performance of three different approaches to delete or modify an object:

1.  **delete**: Deleting a property directly from the object using `delete obj.a`.
2.  **Rest object**: Using destructuring syntax (`const { a, ...rest } = obj;`) to create a new object with all properties except `a` retained.
3.  **New object**: Creating a new object by copying specific properties from an existing object (`const newObj = {\r\n  b: obj.b,\r\n  c: obj.c\r\n};`).

**Options Comparison**

These three approaches offer different trade-offs in terms of performance, memory usage, and code readability:

*   **delete**: This approach is simple and straightforward but can be slower due to the overhead of property lookup and deletion. It also affects the object's internal structure, which might lead to memory fragmentation issues.
*   **Rest object**: This approach creates a new object with a subset of properties, avoiding direct modification of the original object. However, it requires more code and might consume additional memory, especially for large objects.
*   **New object**: This approach creates an entirely new object with specific properties, offering the best performance but also consuming extra memory.

**Pros and Cons**

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

| Approach | Performance | Memory Usage | Code Readability |
| --- | --- | --- | --- |
| delete | Slow | High (object modification) | Low |
| Rest object | Medium | Medium (additional object creation) | Medium (more code required) |
| New object | Fast | High (extra memory allocation) | High (best performance but more complex) |

**Library Usage**

None of the test cases explicitly use a library, so we can focus on vanilla JavaScript implementations.

**Special JS Features or Syntax**

The benchmark uses:

*   **Destructuring syntax**: `const { a, ...rest } = obj;` is used to extract properties from an object. This feature was introduced in ECMAScript 2015 (ES6) and provides a concise way to create new objects with specific properties.
*   **Template literals**: Used for string interpolation within the JavaScript code.

**Other Alternatives**

If you're interested in exploring alternative approaches, consider:

1.  **Object.assign()**: Using `Object.assign()` to copy properties from one object to another can provide similar performance to the "New object" approach but with more memory usage.
2.  **Object.create()**: Utilizing `Object.create()` to create a new object with specific properties can offer a compromise between performance and code readability.

By understanding these different approaches, you'll be better equipped to choose the best method for your specific use case in JavaScript development.

Related benchmarks:

Delete vs destructure for objects vs new object (version: 0)

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

Comparing performance of: delete vs Rest object vs New object

Created: 2 years ago by: Guest

Jump to the latest result

delete

Rest object

New object

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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