Benchmark: Array.from vs spread vs construct manually 5

Script Preparation code:

var src = Object.keys([...Array(10000)]);

Tests:

Array.from
var z = {}; z.z = Array.from(src[Symbol.iterator]());
manual
var z = {}; let n = src.length; let a = Array(n); let iter = src[Symbol.iterator](); for (let i = 0; i < n; ++i) {a[i] = iter.next().value;}; z.z = a;
spread
var z = {}; z.z = [...(src[Symbol.iterator]())];
manual 2
var z = {}; let a = Array(src.length); let iter = src[Symbol.iterator](); for (let i = 0, obj = iter.next(); !obj.done; obj = iter.next()) { a[i++] = obj.value;}; z.z = a;
manual 3
var z = {}; let n = src.length; let a = Array(n); let iter = src[Symbol.iterator](); for (let i = n - 1; i >= 0; --i) {a[i] = iter.next().value;}; z.z = a;

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.from
manual
spread
manual 2
manual 3

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.

**Benchmark Overview**

The provided benchmark measures the performance of three different approaches for creating an array from an iterable source:

1. `Array.from()`
2. Manual iteration using a loop
3. Using the spread operator (`...`)

Each approach has its pros and cons, which are discussed below.

**Approach 1: `Array.from()`**

* **Pros**: concise syntax, efficient and stable.
* **Cons**: may not be as readable for some developers, can be slower than manual iteration in some cases (although this is usually negligible).

`Array.from()` was introduced in ECMAScript 2015 (ES6) as a convenient way to create an array from an iterable source. It takes an iterable object (such as an array, string, or number) and creates a new array containing the values of that iterable.

**Approach 2: Manual iteration**

* **Pros**: can be more readable for some developers, allows for manual control over the loop.
* **Cons**: requires more code than using `Array.from()`, can be slower due to the overhead of the loop.

Manual iteration uses a loop to iterate over the iterable source and populate an array with its values. This approach provides more control over the loop but is generally less concise than using `Array.from()`.

**Approach 3: Using the spread operator (`...`)**

* **Pros**: concise syntax, efficient.
* **Cons**: only supported in ES6+ browsers (including Mobile Safari), may not be as readable for some developers.

Using the spread operator (`...`) creates a new array by spreading the values of an iterable object. This approach is similar to `Array.from()` but uses a more concise syntax.

**Library used**

In this benchmark, none of the approaches use any external libraries. The only library that might be useful in certain cases is `Symbol.iterator`, which is a built-in JavaScript feature for creating iterators. However, it's not necessary to include it in the benchmark since both `Array.from()` and manual iteration can work without it.

**Special JavaScript features or syntax**

The benchmark uses some special JavaScript features:

* The spread operator (`...`) was introduced in ECMAScript 2015 (ES6).
* `Symbol.iterator` is a built-in JavaScript feature for creating iterators, introduced in ECMAScript 2011 (ES6).

No other special JavaScript features or syntax are used in this benchmark.

**Alternatives**

Other alternatives to measure the performance of array creation include:

* Using `Array.prototype.slice()` instead of manual iteration.
* Using `Array.from()` with a custom iterable object that is more complex than a simple array.
* Measuring the performance of other methods for creating arrays, such as using `ArrayBuffer` or `DataView`.
* Comparing the performance of different browsers and versions.

However, these alternatives may not provide meaningful results in this specific benchmark, which focuses on measuring the performance of three straightforward approaches for creating an array from an iterable source.

Related benchmarks:

Array.from vs spread vs construct manually 5 (version: 2)

Comparing performance of: Array.from vs manual vs spread vs manual 2 vs manual 3

Created: 7 years ago by: Registered User

Jump to the latest result

Array.from

manual

spread

manual 2

manual 3

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):