Benchmark: Slice vs Splice vs Shift (More itemsToRemove)

Script Preparation code:

var array = Array.from(Array(10000).keys())
var itemsToRemove = 100

Tests:

array.slice()
array = array.slice(itemsToRemove)
array.splice()
array.splice(0, itemsToRemove)
array.shift()
for (let i = 0 ; i < itemsToRemove ; i++) array.shift()

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
array.slice()
array.splice()
array.shift()

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; rv:123.0) Gecko/20100101 Firefox/123.0

Browser/OS: Firefox 123 on Windows

View result in a separate tab

Test name	Executions per second
array.slice()	85600032.0 Ops/sec
array.splice()	55750896.0 Ops/sec
array.shift()	5554648.5 Ops/sec

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

LLMs can make mistakes. Check important info.

Measuring JavaScript performance is essential, especially when it comes to array manipulation methods like `slice()`, `splice()`, and `shift()`. Let's break down the provided benchmark definition, test cases, and results.

**Benchmark Definition:**
The test compares three methods for removing elements from an array:

1.  `array.slice(itemsToRemove)`: Returns a new array containing all elements except the first `itemsToRemove` elements.
2.  `array.splice(0, itemsToRemove)`: Removes `itemsToRemove` elements from the beginning of the array and returns an array of removed elements.
3.  `for (let i = 0 ; i < itemsToRemove ; i++) array.shift()`: Removes each element at index 0 using the `shift()` method.

**Options Compared:**
The benchmark compares three different approaches:

*   **`slice()`**: A more efficient approach, as it creates a new array and returns it.
*   **`splice()`**: A less efficient approach, as it modifies the original array and returns an array of removed elements.
*   **`shift()`**: An even less efficient approach, as it uses a loop to remove each element individually.

**Pros and Cons:**

*   **`slice()`**: Pros:
    *   More efficient than `splice()`, as it creates a new array.
    *   Less overhead compared to using loops with `shift()`.
*   **`splice()`**: Pros:
    *   Allows for modifying the original array.
*   **`shift()`**:
    *   Pros: Simple and easy to understand.

However, these approaches have significant performance differences:

*   **`slice()`** is generally faster due to its use of a fixed-size allocation in JavaScript's V8 engine.
*   **`splice()`** incurs more overhead due to the allocation of an array for removed elements.
*   **`shift()`** uses more iterations, making it slower.

**Library:**
In this benchmark, no libraries are explicitly mentioned. However, `Array.from()` is used in the script preparation code to create a large array with 10,000 elements, which serves as the input for the tests.

**Special JS Feature/Syntax:** None of the provided benchmarks utilize special JavaScript features or syntax that would affect the results.

Now that we've covered these aspects, let's take a look at some alternative methods:

1.  **`filter()`**: Instead of removing items from an array using `slice()`, `splice()`, or `shift()`, you can use the `filter()` method to create a new array containing only the desired elements.
2.  **Using `map()` and `concat()`**: Another approach is to use `map()` to create a new array with the desired elements, then concatenate it using `concat()`.

These alternatives will be slower than the original methods used in the benchmark:

*   **`filter()`**: Less efficient due to its use of an iterative loop.
*   **Using `map()` and `concat()`**: Also less efficient due to its use of more iterations and function calls.

In conclusion, when it comes to array manipulation, `slice()` is usually the most efficient approach, followed by `splice()`, and then `shift()`. However, there are other alternatives that can be used in specific situations.

Related benchmarks:

Slice vs Splice vs Shift (More itemsToRemove) (version: 0)

Compares the speed for removing 2 items from the beginning of an array

Comparing performance of: array.slice() vs array.splice() vs array.shift()

Created: 2 years ago by: Guest

Jump to the latest result

array.slice()

array.splice()

array.shift()

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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