Benchmark: Array.prototype.slice vs spread operator 2 2

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 5 community runs

Desktop Results:

Chrome 5 runs

Array.prototype.slice

71.3M/s

spread operator

64.8M/s

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

View exact numbers

✓ Array.prototype.slice: 71,306,240 ops/sec
• spread operator: 64,754,640 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: one month ago)

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

Browser/OS: Chrome 149 on Windows

View result in a separate tab

Array.prototype.slice

66.6M/s

spread operator

64.8M/s

View exact numbers

Test name	Executions per second
✓ Array.prototype.slice	66,555,940 Ops/sec
spread operator	64,754,640 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down what's being tested in this benchmark.

**Benchmark Overview**

The test compares the performance of two approaches: using `Array.prototype.slice()` and using the new ES6 spread operator (`[ ...params ]`) to create a shallow copy of an array.

**Options Compared**

There are only two options being compared:

1. **`Array.prototype.slice()`**: This is a traditional method for creating a shallow copy of an array in JavaScript.
2. **Spread Operator `[ ...params ]`**: This is the new ES6 spread operator, introduced in ECMAScript 2015 (ES6), which allows you to create a new array by spreading the elements of an existing array.

**Pros and Cons**

**Array.prototype.slice()**

Pros:

* Widely supported across browsers and platforms
* Familiar syntax for developers

Cons:

* Can be slower than the spread operator, especially for large arrays
* May not preserve the same level of performance consistency as modern JavaScript engines

**Spread Operator `[ ...params ]`**

Pros:

* Faster than `Array.prototype.slice()` for most use cases
* More concise and expressive syntax for creating shallow copies
* Widely supported across modern browsers and platforms

Cons:

* Less familiar syntax for older developers or those not familiar with ES6 features
* May not work as expected in some legacy JavaScript environments

**Other Considerations**

Both approaches create a shallow copy of the original array, which means that only the top-level properties are copied. If you need to copy nested objects or arrays, you'll still need to use `Array.prototype.slice()`.

If you're using an older version of Node.js or another JavaScript engine, the spread operator might not be supported. Additionally, some older browsers may not support ES6 features out of the box.

**Library and Special JS Feature**

There are no libraries used in this benchmark.

**Special JS Features**

The test uses the new ES6 spread operator (`[ ...params ]`), which is a feature introduced in ECMAScript 2015 (ES6). This syntax allows you to create a new array by spreading the elements of an existing array. The use of `var params = [ "hello", true, 7 ];` and `[ ...params ]` demonstrates how this syntax can be used to create a shallow copy of an array.

**Alternatives**

If you're looking for alternative approaches to creating shallow copies of arrays, some other options include:

1. Using the `Array.from()` method: This method creates a new array from an iterable source, such as an existing array or a string.
2. Using the `Object.assign()` method: This method copies the values of an object (or an array) to another object.

Keep in mind that these alternatives may not be as efficient or concise as using the spread operator or `Array.prototype.slice()`.

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

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

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

Created: 5 years ago by: Guest

Go to the latest result

Array.prototype.slice

spread operator

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

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

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

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

Created: 5 years ago by: Guest

Go to the latest result

Array.prototype.slice

spread operator

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 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`