Benchmark: splice vs slice - MeasureThat.net

Script Preparation code:

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

Tests:

slice and slice
var i = a.slice().reverse().findIndex(x => x !== '') a = a.slice(0, a.length - i)
slice and splice
var i = a.slice().reverse().findIndex(x => x !== '') a.splice(a.length - i)
only slice
var i = a.reverse().findIndex(x => x !== '') a = a.slice(i).reverse()
only splice
var i = a.reverse().findIndex(x => x !== '') a.splice(0, i) a.reverse()

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
slice and slice
slice and splice
only slice
only splice

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 90 on Windows

View result in a separate tab

Test name	Executions per second
slice and slice	55.8 Ops/sec
slice and splice	129.1 Ops/sec
only slice	91.7 Ops/sec
only splice	334.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark.

**Benchmark Definition**

The benchmark is defined by the JSON object:
```json
{
    "Name": "splice vs slice",
    "Description": null,
    "Script Preparation Code": "var a = []\r\n\r\nfor (var i = 0; i < 1000 * 1000; i++) {\r\n  a.push(i);\r\n}",
    "Html Preparation Code": null
}
```
This JSON object represents a benchmark with the following characteristics:

* The **Name** is "splice vs slice", indicating that it's comparing the performance of `splice` and `slice` methods.
* The **Script Preparation Code** creates an array `a` containing 1,000,000 elements, initialized with values from 0 to 999,999. This is likely done to warm up the JavaScript engine or ensure a large dataset for benchmarking.

The script preparation code uses the following techniques:

* `push()` method to add elements to the end of the array.
* No explicit looping or array manipulation before the benchmark execution.

**Individual Test Cases**

There are four test cases, each defined in an individual JSON object:
```json
[
    {
        "Benchmark Definition": "var i = a.slice().reverse().findIndex(x => x !== '')\r\na = a.slice(0, a.length - i)",
        "Test Name": "slice and slice"
    },
    {
        "Benchmark Definition": "var i = a.slice().reverse().findIndex(x => x !== '')\r\na.splice(a.length - i)",
        "Test Name": "slice and splice"
    },
    {
        "Benchmark Definition": "    var i = a.reverse().findIndex(x => x !== '')\r\n    a = a.slice(i).reverse()\r\n",
        "Test Name": "only slice"
    },
    {
        "Benchmark Definition": "    var i = a.reverse().findIndex(x => x !== '')\r\n    a.splice(0, i)\r\n    a.reverse()",
        "Test Name": "only splice"
    }
]
```
Each test case is defined by the following:

* A **Benchmark Definition** that represents the specific code snippet to be executed.
* The **Test Name**, which provides a human-readable description of the test case.

The benchmark definition for each test case involves:

* Reversing the array using `reverse()`.
* Finding the index of the first non-empty element using `findIndex(x => x !== '')`.
* Either:
	+ Removing elements from the end of the array using `slice(0, a.length - i)` and then reassigning it to `a` (test case "slice and slice").
	+ Removing the first `i` elements from the beginning of the array using `splice(0, i)` and then reversing it again (test cases "only splice" and "only slice").

**Library Usage**

None of the benchmark definitions explicitly use any external libraries.

**Special JavaScript Features or Syntax**

No specific JavaScript features or syntax are used in the benchmark definition. However, note that:

* The `reverse()` method is a non-standard property in older browsers (pre-IE 9). While not likely to affect the benchmark, it's worth mentioning for completeness.
* Some older browsers might exhibit different behavior when using `splice()` on arrays.

**Pros and Cons of Different Approaches**

Here are some general pros and cons of each approach:

* **Slice and Slice**: This approach can be faster because:
	+ It avoids reversing the entire array, which can be expensive in terms of CPU cycles.
	+ It uses `slice(0, a.length - i)` to remove elements from the end, which is more efficient than using `splice()` on the original array.
* **Slice and Splice**: This approach might be slower because:
	+ Reversing the entire array can be expensive in terms of CPU cycles.
	+ Using `splice()` on the original array can lead to more overhead compared to using `slice()`.
* **Only Slice**: This approach is likely faster because:
	+ It avoids reversing the entire array, which can be expensive in terms of CPU cycles.
	+ It uses a single operation (`reverse()` and then `slice(i).reverse()`) to both reverse and truncate the array.

**Other Alternatives**

Some alternative approaches could be considered:

* Using `Array.prototype.slice.call()` instead of simply `slice()`, as it can provide better performance in older browsers.
* Using `Array.prototype.splice.apply()` instead of `splice()`, as it can provide better performance in older browsers.
* Optimizing the benchmark by reducing the size of the array or using a smaller data type (e.g., `uint8Array`).
* Using a different indexing method, such as binary search, to find the first non-empty element.

Keep in mind that these alternatives are not likely to have a significant impact on the results, and the focus should remain on understanding the behavior of the specific JavaScript features and syntax used in the benchmark.

Related benchmarks:

splice vs slice (version: 1)

Comparing performance of: slice and slice vs slice and splice vs only slice vs only splice

Created: 3 years ago by: Registered User

Jump to the latest result

slice and slice

slice and splice

only slice

only splice

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