Benchmark: Slice vs Splice vs Shift

Script Preparation code:

var array = [1, 2, 3, 4, 5, 6, 7, 8]
var itemsToRemove = 2

Tests:

array.slice()
array = array.slice(2)
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: 9 hours ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:133.0) Gecko/20100101 Firefox/133.0

Browser/OS: Firefox 133 on Windows

View result in a separate tab

Test name	Executions per second
array.slice()	54154828.0 Ops/sec
array.splice()	35868996.0 Ops/sec
array.shift()	85106744.0 Ops/sec

Autogenerated LLM Summary (model gemma2:9b, generated 2 months ago):

LLMs can make mistakes. Check important info.

This benchmark tests the performance of three different methods for removing the first two elements from an array in JavaScript:

* **`array.slice(2)`:** This method creates a new array containing all elements from index 2 (the third element) to the end of the original array, effectively discarding the first two elements.
* **`array.splice(0, itemsToRemove)`:**  This method modifies the original array directly by removing `itemsToRemove` (in this case, 2) elements starting at index 0 (the beginning).

* **`for (let i = 0 ; i < itemsToRemove ; i++) array.shift()`:** This method uses a loop to call the `array.shift()` method repeatedly.  `array.shift()` removes and returns the first element of an array, modifying the original array.

**Pros and Cons:**

* **`slice()`:**
    * **Pros:** Non-destructive - doesn't modify the original array, creating a new one. This can be helpful if you need to preserve the original data. Relatively lightweight operation.
    * **Cons:** Creates a new array which incurs some memory overhead.

* **`splice()`:**
    * **Pros:** Modifies the original array directly, avoiding the creation of a new array and potentially saving memory. Can remove multiple elements at once.
    * **Cons:** Can be slightly slower than `slice()` for simple removal operations like this one.

* **`shift()` Loop:** 
    * **Pros:**  Potentially very efficient if you need to remove many elements from the beginning of an array.  
    * **Cons:** More verbose and can be less readable than `splice()`. Can be slower for removing only a few elements because of the loop overhead.

**Considerations:**

The best method depends on your specific needs:

* If preserving the original array is crucial, use `slice()`.
* If modifying the original array directly is acceptable and you need to remove multiple items, `splice()` is generally efficient. 
* If you frequently remove many elements from the beginning of an array, a loop using `shift()` might be slightly faster.

**Alternatives:**

While this benchmark focuses on these three methods, other approaches exist for removing array elements:

* **`array.forEach()` and manually updating indices:** This involves iterating through the array and shifting elements to fill the gaps created by removed elements.  It can be complex to implement correctly but offers fine-grained control over the process.
* **Using libraries like Lodash:** Libraries often provide optimized functions for manipulating arrays, including removing elements efficiently.

Related benchmarks:

Slice vs Splice vs Shift (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: 3 years ago by: Guest

Jump to the latest result

array.slice()

array.splice()

array.shift()

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gemma2:9b, generated 2 months ago):