Benchmark: Remove by splice vs copyWithin

Script Preparation code:

var array = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99]

function deleteBySplice (array, element) {
  var index = array.indexOf( element );
  if (index !== -1) {
  	array.splice( index, 1 );
  }
}

function deleteByCopyWithin (array, element) {
  var index = array.indexOf( element );
  if (index !== -1) {
  	array.copyWithin( index, index + 1 );
    --array.length;
  }
}

Tests:

Delete by Splice
deleteBySplice( array, 42 ); deleteBySplice( array, 0 ); deleteBySplice( array, 68 );
Delete by copyWithin
deleteByCopyWithin( array, 42 ); deleteByCopyWithin( array, 0 ); deleteByCopyWithin( array, 68 );

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Delete by Splice
Delete by copyWithin

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one month ago)

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

Browser/OS: Firefox 112 on Windows

View result in a separate tab

Test name	Executions per second
Delete by Splice	1617989.0 Ops/sec
Delete by copyWithin	1604083.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript benchmarks.

**Benchmark Definition JSON**

The provided JSON represents a benchmark test case for in-place deletion of an element from an array using two different approaches: `deleteBySplice` and `deleteByCopyWithin`.

1. **Options compared**: The two options being compared are:
	* `deleteBySplice`: This approach uses the `splice()` method to delete an element from the array.
	* `deleteByCopyWithin`: This approach uses the `copyWithin()` method to shift all elements after the target index one position forward, effectively deleting the element.

2. **Pros and Cons**:
	* `deleteBySplice`:
		+ Pros: More intuitive and straightforward for in-place deletion.
		+ Cons: Can lead to performance issues when dealing with large arrays or sparse data.
	* `deleteByCopyWithin`:
		+ Pros: Avoids the need for shifting elements, which can be beneficial for sparse data or large arrays.
		+ Cons: Less intuitive and may require more code to achieve the same result.

3. **Library**: There is no explicit library mentioned in the benchmark definition JSON. However, `splice()` and `copyWithin()` are built-in JavaScript methods that do not rely on external libraries.

4. **Special JS feature or syntax**: There is no special JS feature or syntax used in this benchmark. The code uses standard JavaScript syntax and built-in methods.

**Benchmark Preparation Code**

The script preparation code provides the initial array definition:
```javascript
var array = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99]
```
This code defines an array of 100 elements, which will be used for the benchmark tests.

**Individual Test Cases**

The individual test cases are defined as follows:

1. "Delete by Splice":
```javascript
deleteBySplice( array, 42 );
deleteBySplice( array,  0 );
deleteBySplice( array, 68 );
```
This test case deletes the elements at indices 42, 0, and 68 using the `deleteBySplice` approach.

2. "Delete by copyWithin":
```javascript
deleteByCopyWithin( array, 42 );
deleteByCopyWithin( array,  0 );
deleteByCopyWithin( array, 68 );
```
This test case deletes the elements at indices 42, 0, and 68 using the `deleteByCopyWithin` approach.

**Latest Benchmark Result**

The latest benchmark result provides the execution times for each test case:
```javascript
{
    "RawUAString": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.0 Safari/605.1.15",
    "Browser": "Safari 18",
    "DevicePlatform": "Desktop",
    "OperatingSystem": "Mac OS X 10.15.7",
    "ExecutionsPerSecond": 4259657.5,
    "TestName": "Delete by Splice"
}

{
    "RawUAString": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.0 Safari/605.1.15",
    "Browser": "Safari 18",
    "DevicePlatform": "Desktop",
    "OperatingSystem": "Mac OS X 10.15.7",
    "ExecutionsPerSecond": 4176732.0,
    "TestName": "Delete by copyWithin"
}
```
The first result indicates that the `deleteBySplice` approach executed at a rate of approximately 4,259,657 executions per second on this specific browser and environment.

**Other Alternatives**

Some alternative approaches for in-place deletion of an element from an array include:

* Using `indexOf()` and then shifting elements to fill the gap.
* Using a library like Lodash or Ramda, which provide optimized implementations of array manipulation functions.
* Using a custom implementation that uses bitwise operations to eliminate the need for shifting.

However, these alternatives are not included in this benchmark test case.

Related benchmarks:

Remove by splice vs copyWithin (version: 0)

In-place deletion of an element from an array.

Comparing performance of: Delete by Splice vs Delete by copyWithin

Created: 8 years ago by: Guest

Jump to the latest result

Delete by Splice

Delete by copyWithin

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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