Benchmark: slice vs destruction

Script Preparation code:

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

Tests:

slice
const foo = list.slice()
destruction
const foo = [...list]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
slice
destruction

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 6 months ago)

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

Browser/OS: Chrome 141 on Windows

View result in a separate tab

Test name	Executions per second
slice	7163.6 Ops/sec
destruction	7193.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested.

**Overview**
The benchmark is comparing two approaches to create a copy of an array: `slice()` and destructuring using the spread operator (`[...]`). The test case uses an empty array `list` created with a loop, which will be used as the input for both tests.

**Options compared**

* **Slice**: `const foo = list.slice()`
	+ This method creates a shallow copy of the original array by returning a new array object referencing the elements of the original array.
	+ Pros:
		- Fast and efficient
		- Works well with large arrays
	+ Cons:
		- Creates a new object reference, which can be slower than other methods for very large arrays due to memory allocation overhead
* **Destruction**: `const foo = [...list]`
	+ This method creates a shallow copy of the original array by spreading its elements into a new array.
	+ Pros:
		- Fast and efficient
		- Creates a new object reference, which can be beneficial for very large arrays
	+ Cons:
		- May not work correctly with array-like objects (e.g., `String` or `ArrayBuffer`)
* **Other alternatives**:
	+ Other methods like `concat()` or creating an array literal (`[...list]`) are not being compared in this benchmark.

**Library and syntax**

None of the tests use any specific JavaScript library. However, it's worth noting that both `slice()` and destructuring using the spread operator are part of the standard JavaScript API.

**Special JS feature or syntax**

There is no special JS feature or syntax used in this benchmark other than the array literals and methods being compared.

**Benchmark preparation code**
The script preparation code creates an empty array `list` with 1,000,000 elements using a loop. This will be used as the input for both tests.

**Latest benchmark result**

The benchmark results show the execution speed of each test case on a specific browser (Chrome 129) and device platform (Desktop). The "ExecutionsPerSecond" value indicates how many times each test case was executed per second.

In this case, the `slice()` method appears to be slightly faster than the destruction method. However, it's essential to note that these results may vary depending on the specific browser, device, and system configuration being used for the benchmarking process.

Overall, this benchmark provides a good comparison of two commonly used methods for creating array copies in JavaScript, highlighting their relative performance characteristics.

Related benchmarks:

slice vs destruction (version: 0)

Comparing performance of: slice vs destruction

Created: 5 years ago by: Guest

Jump to the latest result

slice

destruction

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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