Benchmark: Fixed Array.prototype.slice vs spread operator

Tests:

Array.prototype.slice
var params = [ "hello", true, 7 ]; var other = params.slice();
spread operator
var params = [ "hello", true, 7 ] var other = [ ...params ]

Historical Performance Data aggregated from 6 community runs

Desktop Results:

Chrome 6 runs

Array.prototype.slice

51.5M/s

spread operator

37.3M/s

Fastest: Array.prototype.slice (1.4x faster)

View exact numbers

✓ Array.prototype.slice: 51,471,488 ops/sec
• spread operator: 37,332,528 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.slice
spread operator

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36

Browser/OS: Chrome 121 on Mac OS X 10.15.7

View result in a separate tab

Array.prototype.slice

44.0M/s

spread operator

34.3M/s

View exact numbers

Test name	Executions per second
✓ Array.prototype.slice	44,044,292 Ops/sec
spread operator	34,340,528 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 JSON and explain what's being tested in the benchmark.

**Overview**

The benchmark compares two ways to create a new array from an existing one:

1. **Array.prototype.slice()**: A traditional method that creates a shallow copy of a subset of an array.
2. **Spread operator (new ES6 syntax)**: A concise way to create a new array by spreading the elements of an existing array.

**Options Compared**

The benchmark tests two options:

* `Array.prototype.slice()`: The traditional method for creating a new array from a subset of an existing one.
* Spread operator (`[ ...params ]`): A new syntax introduced in ES6 that creates a new array by spreading its elements.

**Pros and Cons**

### Array.prototype.slice()

Pros:

* Wide support across browsers and platforms, as it's a part of the DOM API.
* Fast and efficient, especially when working with large arrays.

Cons:

* Can be slow for very small arrays (e.g., `[1]` or `[]`) due to overhead from creating an array copy.
* May not perform well on older browsers or devices with limited resources.

### Spread Operator

Pros:

* Concise and readable syntax, making it easier to write and understand.
* Fast and efficient for most use cases, including small arrays.

Cons:

* Not supported in older browsers (pre-ES6) or platforms without JavaScript engines that support ES6 features.
* May require more memory allocation due to the creation of a new array object.

**Other Considerations**

When choosing between `Array.prototype.slice()` and the spread operator, consider the following factors:

* Performance: For most use cases, both methods are fast. However, if you're working with very small arrays or older browsers, the spread operator might be a better choice.
* Readability: The spread operator provides a more concise syntax, making it easier to read and write.

**Library Usage**

There is no library used in this benchmark.

**Special JS Features/Syntax**

The benchmark uses the **spread operator (new ES6 syntax)**, which was introduced in ECMAScript 2015 (ES6). This feature allows you to create a new array by spreading its elements using the `...` syntax. The spread operator is a concise and readable way to perform this operation.

**Alternatives**

If you don't want to use JavaScript or prefer a different approach, consider:

* Using an existing library that provides similar functionality, such as `lodash` or `array-utility`.
* Implementing your own solution using low-level array operations (e.g., loops and array copying).
* Using a different data structure, like objects or sets, instead of arrays.

Keep in mind that these alternatives might not provide the same level of performance or conciseness as the JavaScript solutions.

Fixed Array.prototype.slice vs spread operator (version: 0)

Compare the new ES6 spread operator with the traditional slice() method

Comparing performance of: `Array.prototype.slice vs spread operator`

Created: 2 years ago by: Guest

Go to the latest result

Array.prototype.slice

spread operator

Historical Performance Data aggregated from 6 community runs

Desktop Results:

Chrome 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Fixed Array.prototype.slice vs spread operator (version: 0)

Compare the new ES6 spread operator with the traditional slice() method

Comparing performance of: Array.prototype.slice vs spread operator

Created: 2 years ago by: Guest

Go to the latest result

Array.prototype.slice

spread operator

Historical Performance Data aggregated from 6 community runs

Desktop Results:

Chrome 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `Array.prototype.slice vs spread operator`