Benchmark: Array.from vs Spread vs Concat

Tests:

Array.from
var fooSet = new Array(); for(var i=0;i<100;i++) { fooSet.push(i); } var other = Array.from(fooSet);
Spread
var fooSet = new Array(); for(var i=0;i<100;i++) { fooSet.push(i); } var other = [...fooSet];
Concat
var fooSet = new Array(); for(var i=0;i<100;i++) { fooSet.push(i); } var other = fooSet.concat();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.from
Spread
Concat

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; rv:108.0) Gecko/20100101 Firefox/108.0

Browser/OS: Firefox 108 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
Array.from	499064.4 Ops/sec
Spread	760628.2 Ops/sec
Concat	1063859.8 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested.

**Benchmark Definition**

The benchmark is designed to compare three approaches for creating an array from a set of numbers:

1. `Array.from()`
2. The spread operator (`...`)
3. `concat()` method

These three approaches are compared in terms of performance, which is measured by the number of executions per second.

**Options being compared**

The benchmark tests three different options:

* `Array.from()`: This method creates a new array from an iterable (such as a set or an array) and returns that array.
* Spread operator (`...`): The spread operator allows you to expand an iterable into individual elements, which can be used to create a new array.
* `concat()` method: This method concatenates two or more arrays together.

**Pros and Cons of each approach**

Here's a brief summary of the pros and cons of each approach:

* `Array.from()`: Pros:
	+ More explicit and readable than spread operator
	+ Can be used with any iterable, not just arrays
	+ Returns an array as expected
Cons:
	+ May incur additional overhead due to function call
* Spread operator (`...`): Pros:
	+ Concise and expressive syntax
	+ Fast and efficient for simple use cases
	+ Widely supported in modern browsers
Cons:
	+ Less explicit than `Array.from()`
	+ Limited support in older browsers
* `concat()` method: Pros:
	+ Easy to read and write, especially for those familiar with its usage
	+ Works well with arrays or other iterables
Cons:
	+ Can be slower than spread operator due to function call overhead
	+ Returns an array of arrays (if used with two inputs)

**Library**

In this benchmark, there is no explicit library being used. The `Array.from()` method and the spread operator are built-in JavaScript features.

However, it's worth noting that older browsers may not support these features natively, but most modern browsers do.

**Special JS feature or syntax**

This benchmark uses the spread operator (`...`), which was introduced in ECMAScript 2015 (ES6). It allows you to expand an iterable into individual elements, making it a concise way to create arrays from iterables.

However, older browsers may not support this syntax, so it's likely that the `Array.from()` method is being used as a fallback for compatibility reasons.

Related benchmarks:

Array.from vs Spread vs Concat (version: 0)

Comparing performance of: Array.from vs Spread vs Concat

Created: 4 years ago by: Guest

Jump to the latest result

Array.from

Spread

Concat

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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