Benchmark: Set: Array.from vs Spread

Script Preparation code:

var setObj = new Set;
for (let i = 0; i < 100; ++i) {
	setObj.add(i);
}
var res = [];

Tests:

Array.from
res = Array.from(setObj);
Spread
res = [...setObj];

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.from
Spread

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 23 hours ago)

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:150.0) Gecko/20100101 Firefox/150.0

Browser/OS: Firefox 150 on Linux

View result in a separate tab

Test name	Executions per second
Array.from	854275.2 Ops/sec
Spread	860732.8 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 JavaScript microbenchmark provided by MeasureThat.net.

**What is tested?**

The benchmark tests two approaches for creating an array from a Set object:

1. `Array.from(setObj)`
2. ` [...setObj]` (the spread operator)

A Set object, created using `var setObj = new Set()`, contains 100 unique integers between 0 and 99. The script then adds each of these numbers to the Set.

**Options compared**

The two approaches being tested are:

1. **Array.from(setObj)**: This method creates a new array from the elements of the Set object.
2. **Spread operator ( [...setObj] )**: This syntax creates a new array by spreading the elements of the Set object.

**Pros and Cons**

1. **Array.from(setObj)**
	* Pros:
		+ More explicit and readable code
		+ Can be more performant if you need to access the resulting array by index or use array methods like `map()`, `filter()`, etc.
	* Cons:
		+ May incur additional overhead due to the creation of an intermediate array
2. **Spread operator ( [...setObj] )**
	* Pros:
		+ More concise and expressive code
		+ Creates a new array without creating an intermediate one
	* Cons:
		+ Less readable than `Array.from()`
		+ May be slower due to the creation of multiple, small arrays

**Library**

The Set object is a built-in JavaScript API, introduced in ECMAScript 2015 (ES6). Its purpose is to represent an unordered collection of unique values.

**Special JS feature or syntax**

None mentioned. However, it's worth noting that the spread operator (` [...setObj]`) was also introduced in ES6 as `Destructuring assignment`.

**Benchmark preparation code and test cases**

The script preparation code creates a new Set object with 100 unique integers between 0 and 99, and then assigns an empty array to `res`. The two test cases compare the performance of creating the array using `Array.from()` and the spread operator.

**Alternative approaches**

1. **Using the spread operator on an existing array**: Instead of spreading a Set object, you could create an array with the spread operator and add elements from the Set to it.
```javascript
var arr = [...setObj];
```
2. **Converting the Set to an array directly**: If you need to access the elements as a numeric array, you can convert the Set to an array using `Array.from()` or the spread operator on an existing array, and then use `map()` or other array methods.
```javascript
var arr = [...setObj].map(i => i);
```
Keep in mind that these alternative approaches may have different performance characteristics compared to the original test cases.

Related benchmarks:

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

Comparing performance of: Array.from vs Spread

Created: 6 years ago by: Guest

Jump to the latest result

Array.from

Spread

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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