Benchmark: Array copy - MeasureThat.net

Script Preparation code:

var arr = []
for (let i = 0; i < 100_000; i++) arr.push(Math.random())

Tests:

Slice
const copy = arr.slice()
Spread
const copy = [...arr]
From
const copy = Array.from(arr)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Slice
Spread
From

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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 the provided benchmark.

The main objective of this benchmark is to measure the performance difference between three ways to create a copy of an array in JavaScript:

1. `arr.slice()`
2. `[...arr]` (spread syntax)
3. `Array.from(arr)`

These approaches are compared to determine which one is the most efficient and fastest.

**Approach 1: `slice()`**

The `slice()` method returns a shallow copy of a portion of an array. It's a built-in JavaScript method that creates a new array object with a subset of elements from the original array.

Pros:

* Wide support across browsers and versions
* Simple and easy to read

Cons:

* Returns a shallow copy, which means it only copies the top-level properties of the array. If the original array contains nested objects or arrays, those will be copied as references, not as deep copies.
* Can be slower than other approaches for very large arrays due to its overhead.

**Approach 2: Spread syntax `[...arr]`**

The spread syntax is a feature introduced in ECMAScript 2015 (ES6). It allows you to create a new array by spreading the elements of an existing array.

Pros:

* Fast and efficient, as it only requires a shallow copy of the array
* Wide support across modern browsers and Node.js versions

Cons:

* Only works with arrays; cannot be used with other types of collections (e.g., objects)
* May require additional imports or polyfills for older browsers or environments.

**Approach 3: `Array.from(arr)`**

`Array.from()` is another method introduced in ECMAScript 2015 (ES6) that creates a new array from an iterable (such as an array, object, or string).

Pros:

* Fast and efficient, as it only requires a shallow copy of the array
* Can be used with other types of collections beyond arrays

Cons:

* May require additional imports or polyfills for older browsers or environments.

**Library/Language Features**

None of the benchmark uses any external libraries. However, it does use some modern JavaScript features, such as:

* Arrow functions (`=>`)
* Template literals (`\r\n`)

These features are widely supported in modern browsers and Node.js versions.

**Special JS Feature/Syntax**

The benchmark uses ES6 spread syntax (`[...arr]`) and `Array.from(arr)` methods. These features were introduced in ECMAScript 2015 (ES6) and require a modern JavaScript engine or environment to execute.

Other Alternatives

If you're interested in exploring alternative approaches for creating array copies, here are a few more options:

* Using the `concat()` method: `arr.concat()`
* Using the `Array.prototype.slice.call(arr)` method: `Array.prototype.slice.call(arr)`
* Using the `Buffer` API (for arrays of binary data): `new Buffer(arr)`

Keep in mind that these alternatives may have different performance characteristics, syntax requirements, or compatibility with older browsers and environments.

Related benchmarks:

Array copy (version: 0)

Comparing performance of: Slice vs Spread vs From

Created: 4 years ago by: Guest

Jump to the latest result

Slice

Spread

From

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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