Benchmark: slice VS splice VS filter: deleting one item

Script Preparation code:

var list = [];
for (var i = 0; i < 1000 * 1000; i++) {
  list.push(i);
}

Tests:

slice
list = [ ...list.slice(0, 50000), ...list.slice(50000 + 1) ];
splice
newList = [...list]; newList.splice(50000, 1);
filter
newList = list.filter(i => i !== 50000);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
slice
splice
filter

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 96 on Windows

View result in a separate tab

Test name	Executions per second
slice	96.0 Ops/sec
splice	580.2 Ops/sec
filter	59.9 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks and explore what's tested in this specific benchmark.

**Benchmark Overview**

The benchmark tests three different approaches to delete an item from a large list: `slice`, `splice`, and `filter`. The goal is to determine which approach performs better in terms of execution speed.

**Approaches Compared**

1. **Slice**: Uses the `slice()` method to create a new array that includes a subset of elements from the original array.
2. **Splice**: Uses the `splice()` method to remove an element at a specified index from the original array.
3. **Filter**: Uses the `filter()` method to create a new array with only the elements that pass a test (in this case, not being equal to 50000).

**Pros and Cons of Each Approach**

1. **Slice**:
	* Pros: Creates a new array, which can be faster than modifying the original array.
	* Cons: Requires more memory allocation, as it creates a new array with the desired subset of elements.
2. **Splice**:
	* Pros: Modifies the original array in place, which can be more efficient for large arrays.
	* Cons: Can be slower due to the overhead of modifying the array.
3. **Filter**:
	* Pros: Modifies the original array in place, which can be more efficient than creating a new array.
	* Cons: Can be slower due to the overhead of creating a new array with filtered elements.

**Library and Purpose**

None of these approaches use a library specifically for this benchmark. However, `slice()` and `splice()` are built-in methods that are part of the ECMAScript standard.

**Special JS Feature or Syntax**

There is no special JavaScript feature or syntax used in this benchmark. The code only uses basic array operations and methods.

**Other Alternatives**

If you want to test other approaches for deleting an item from a list, some alternatives could be:

* Using `map()` with a callback function that returns `undefined` for the desired element.
* Using `reduce()` with a callback function that removes the desired element from the accumulator.
* Using `forEach()` and modifying the array in place using `splice()`.
* Using a custom implementation of an array data structure, such as a linked list or a hash table.

These alternatives would likely have different performance characteristics than the approaches tested in this benchmark.

Related benchmarks:

slice VS splice VS filter: deleting one item (version: 1)

100k list

Comparing performance of: slice vs splice vs filter

Created: 4 years ago by: Registered User

Jump to the latest result

slice

splice

filter

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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