Benchmark: Array.prototype.slice vs spread operator - large array 100000

Script Preparation code:

var arr = Array.from({length: 10000}, () => Math.random())

Tests:

Array.prototype.slice
var other = arr.slice();
spread operator
var other = [ ...arr ]

Historical Performance Data aggregated from 10 community runs

Desktop Results:

Chrome 10 runs

spread operator

595K/s

Array.prototype.slice

509K/s

Fastest: spread operator (1.2x faster)

View exact numbers

✓ spread operator: 595,319 ops/sec
• Array.prototype.slice: 508,962 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: 6 months ago)

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

Browser/OS: Chrome 144 on Mac OS X 10.15.7

View result in a separate tab

spread operator

834K/s

Array.prototype.slice

825K/s

View exact numbers

Test name	Executions per second
✓ spread operator	834,305 Ops/sec
Array.prototype.slice	824,755 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.

**Benchmark Definition**

The benchmark is designed to compare the performance of two approaches:

1. **Array.prototype.slice()**: A traditional method for creating a shallow copy of an array, which takes an integer argument specifying the number of elements to include in the new array.
2. **Spread operator (`[ ...arr ]`)**: The new ES6 spread operator, introduced in JavaScript 2015, allows you to create a new array from an existing one by using the `...` syntax.

**Options being compared**

The benchmark compares these two approaches on a large array of 100,000 elements. The goal is to determine which method is faster for this specific use case.

**Pros and Cons of each approach:**

* **Array.prototype.slice()**: Pros:
	+ Widely supported and well-established method.
	+ Simple to understand and implement.
* Cons:
	+ May be slower than the spread operator due to its implementation in JavaScript engines.
	+ May cause issues when dealing with large arrays, as it creates a new array object that can lead to memory fragmentation.
* **Spread operator (`[ ...arr ]`)**: Pros:
	+ Introduced in ES6, which means modern browsers and JavaScript engines have optimized support for it.
	+ Can be faster than the slice method due to its optimized implementation.
* Cons:
	+ May not be as widely supported or well-established as the slice method.
	+ Can be slower for very large arrays due to memory allocation.

**Library/dependencies**

There is no library or dependency explicitly mentioned in the benchmark definition, but it's likely that the `Array.from()` function used in the script preparation code is a part of the JavaScript standard library.

**Special JS feature/syntax**

The spread operator (`[ ...arr ]`) introduced in ES6 is a special syntax feature. It allows you to create a new array by iterating over an existing array and including each element from the original array in the new array.

**Other alternatives**

If you want to explore other approaches, here are some alternatives:

1. **Array.prototype.concat()**: Another method for creating a new array, but it may be slower than the slice method or spread operator.
2. **Array.prototype.splice()**: A method that modifies the original array by removing elements from the end and returns an array of removed elements, which can be used to create a new array.
3. **Library functions**: Depending on your specific use case, you might want to explore using library functions like `lodash` or `ramda` that provide optimized implementations for common array operations.

Keep in mind that the choice of method ultimately depends on the specific requirements and constraints of your project.

Array.prototype.slice vs spread operator - large array 100000 (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 10 community runs

Desktop Results:

Chrome 10 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 - large array 100000 (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 10 community runs

Desktop Results:

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