Benchmark: Remove element from array v2

Script Preparation code:

var arr = [];
for (var i = 0; i < 10000; i++) {
  arr.push(Math.floor(Math.random() * 1000) + 1)
}
arr.splice(5000, 0, 0)

Tests:

filter (immutable)
var tempResult = arr.filter(v => v !== 0);
indexOf and delete (will leave initial length of array) (mutable)
var index = arr.indexOf(0); delete arr[index]; var tempResult = arr;
indexOf and splice (mutable)
var index = arr.indexOf(0); arr.splice(index, 1); var tempResult = arr;
indexOf and slice and spread (immutable)
var index = arr.indexOf(0); var tempResult = [...arr.slice(0, index), ...arr.slice(index + 1)]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
filter (immutable)
indexOf and delete (will leave initial length of array) (mutable)
indexOf and splice (mutable)
indexOf and slice and spread (immutable)

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 104 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
filter (immutable)	22639.7 Ops/sec
indexOf and delete (will leave initial length of array) (mutable)	829148.6 Ops/sec
indexOf and splice (mutable)	7939405.0 Ops/sec
indexOf and slice and spread (immutable)	7079069.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 on MeasureThat.net.

**Benchmark Context**

The provided JSON represents a benchmark for removing an element from an array in JavaScript. The script preparation code generates a large array with 10,000 random integers and sets its fifth element to 0. The benchmark consists of four test cases:

1. **indexOf and delete (will leave initial length of array) (mutable)**: This approach uses the `indexOf` method to find the index of the desired element, then deletes it using the `splice` method.
2. **indexOf and splice (mutable)**: Similar to the previous one, but it uses `splice` directly without checking if the element is present first.
3. **indexOf and slice and spread (immutable)**: This approach uses the `slice` method to create a new array with elements before the index of the desired element, and then spreads the remaining elements into a new array using the spread operator (`...`).
4. **filter (immutable)**: This approach uses the `filter` method to create a new array with elements that do not match the condition (i.e., non-zero values).

**Library Used**

There is no explicitly mentioned library in the provided JSON, but it's likely that the benchmarks are running in a Node.js environment with the built-in JavaScript features.

**Special JS Features/Syntax**

The benchmarks use the following special JS features/syntax:

* `slice` method
* Spread operator (`...`)
* `filter` method

However, it's worth noting that the `indexOf` and `splice` methods are not new features. They have been part of the JavaScript language since its inception.

**Options Compared**

The benchmarks compare the performance of four different approaches to remove an element from an array:

1. **Mutable**: Using `indexOf` and `splice` or `delete` to remove the element.
2. **Immutable**: Using `slice` and spread operator (`...`) to create a new array with elements before the index of the desired element.

**Pros and Cons**

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

1. **Mutable (indexOf and delete or splice)**:
	* Pros: Simple, efficient, and widely supported.
	* Cons: Can be slow for large arrays, as it involves searching for the index and then modifying the array.
2. **Immutable** (`slice` and spread operator):
	* Pros: Efficient, immutable, and easy to reason about. Creates a new array without modifying the original.
	* Cons: May require more memory allocation, depending on the size of the arrays.

**Other Considerations**

When evaluating these benchmarks, consider the following:

* **Cache locality**: How well do each approach utilize cache locality? For example, `slice` and spread operator may exhibit better cache locality than `indexOf` and `splice`.
* **Array resizing**: When removing an element, does the array need to be resized? If so, how does this affect performance?
* **Garbage collection**: How does each approach impact garbage collection, especially for large arrays?

**Alternatives**

If you're looking for alternative approaches or want to explore other JavaScript features, consider:

1. **Array.prototype.reduce() and Array.prototype.findIndex()**: These methods can be used to find the index of an element without using `indexOf`.
2. **Array.prototype.forEach() and Array.prototype.findIndex()**: These methods can be used to iterate over arrays in a more functional way.
3. **ES6+ features**: Explore other modern JavaScript features like `async/await`, `Generator functions`, or `Symbolic references`.

Related benchmarks:

Remove element from array v2 (version: 0)

Comparing performance of: filter (immutable) vs indexOf and delete (will leave initial length of array) (mutable) vs indexOf and splice (mutable) vs indexOf and slice and spread (immutable)

Created: 2 years ago by: Guest

Jump to the latest result

filter (immutable)

indexOf and delete (will leave initial length of array) (mutable)

indexOf and splice (mutable)

indexOf and slice and spread (immutable)

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