Benchmark: Convert Set to Array

Script Preparation code:

var testSet = new Set();
for (let i = 1; i <= 100000; i++) {
  testSet.add(i);
}

Tests:

Array.from()
const arrayFrom = Array.from(testSet.values());
spread operator
const arraySpread = [...testSet];
for...of loop
const arrayForOf = []; for (const value of testSet) { arrayForOf.push(value); }
iterator.next()
const arrayWhileNext = []; let iterator = testSet.values(); let next = iterator.next(); while (!next.done) { arrayWhileNext.push(next.value); next = iterator.next(); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.from()
spread operator
for...of loop
iterator.next()

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 months ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Browser/OS: Chrome 130 on Windows

View result in a separate tab

Test name	Executions per second
Array.from()	3198.5 Ops/sec
spread operator	3332.1 Ops/sec
for...of loop	1061.8 Ops/sec
iterator.next()	841.4 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):

LLMs can make mistakes. Check important info.

The benchmark you provided focuses on measuring the performance of different methods used to convert a JavaScript `Set` object into an array. Let's break down the key components and compare the various methods, including their pros and cons.

### Benchmark Overview

1. **Preparation Code**: 
   The preparation code initializes a `Set` with integers from 1 to 100,000. This is the data structure that will be converted into an array in each of the test cases.

2. **Test Cases**:
   Each test case aims to measure the time taken for different approaches to convert the `Set` to an array:

- **Array.from()**: This method creates a new array instance from an iterable or array-like object, in this case, the values of the `Set`.
   - **Spread Operator**: The spread operator (`...`) allows an iterable such as a `Set` to be expanded in places where zero or more elements are expected. It effectively creates a new array from the `Set`.
   - **for...of Loop**: This loop iteratively accesses each value in the `Set` and pushes it into a new array.
   - **Iterator.next()**: This method uses the explicit iterator of the `Set`, manually invoking `next()` to get each value and pushing it into an array.

### Performance Results

From the latest benchmark results, the execution speeds (in executions per second) for the methods are as follows:

1. **Spread Operator**: 3332.14
2. **Array.from()**: 3198.50
3. **for...of Loop**: 1061.78
4. **iterator.next()**: 841.39

### Comparison of Approaches

1. **Array.from()**:
   - **Pros**: 
     - Simple and readable syntax.
     - Convenient for converting any iterable into an array.
   - **Cons**: 
     - Slightly less performant compared to the spread operator in this benchmark.
   
2. **Spread Operator (`...`)**:
   - **Pros**:
     - Very concise and readable syntax.
     - Generally has high performance when dealing with iterable objects, as shown in the benchmark.
   - **Cons**:
     - It may appear less explicit than using `Array.from()`, which explicitly conveys the intent of creating an array.

3. **for...of Loop**:
   - **Pros**:
     - Provides clear sequential access to each element.
   - **Cons**: 
     - More verbose compared to the other methods.
     - Slower in execution compared to `Array.from()` and the spread operator.

4. **Iterator.next()**:
   - **Pros**:
     - Offers complete control over the iteration, which can be useful for more complex operations.
   - **Cons**:
     - Most verbose and less efficient for simply converting a `Set` to an array. 
     - The complexity may overshadow simplicity and readability.

### Other Considerations

- **Readability vs. Performance**: While performance is important, readability and maintainability should also be considered, especially in team projects. The spread operator and `Array.from()` tend to offer a good balance.
- **Use Cases**: The chosen method may depend on additional requirements. If the conversion is part of a larger operation involving more complex logic, the `for...of` can make it easier to include additional processing logic within the loop.

### Alternatives

- **Map**: An alternative way to accomplish similar tasks could involve transforming values using `Array.from()` or spread with additional mapping operations.
- **Other Libraries**: Libraries like Lodash provide utility functions (e.g., `_.map()`) that can work with any iterable, allowing developers to convert or manipulate sets and other data structures with additional capabilities for chaining and functional programming paradigms.

In summary, while the benchmark effectively measures the performance of different approaches to convert a `Set` to an array, the choice of method depends on the specific requirements of your project, including performance needs, code readability, and maintainability considerations.

Related benchmarks:

Convert Set to Array (version: 0)

Comparing performance of: Array.from() vs spread operator vs for...of loop vs iterator.next()

Created: 2 months ago by: Guest

Jump to the latest result

Array.from()

spread operator

for...of loop

iterator.next()

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):