Benchmark: Map -> Array - MeasureThat.net

Script Preparation code:

var map = new Map()
for (let i = 0; i< 100; i++) {
	map.set(Math.random().toString(), Math.random())
}

Tests:

From
Array.from(map.values())
New
new Array(...map.values())

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
From
New

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Firefox 133 on Linux

View result in a separate tab

Test name	Executions per second
From	1103123.1 Ops/sec
New	1044006.6 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 6 months ago):

LLMs can make mistakes. Check important info.

Let's break down what's being tested in this JavaScript microbenchmark.

**Benchmark Overview**

The benchmark measures the performance difference between two approaches to convert a Map object into an array:

1. Using `Array.from()`: Specifically, `Array.from(map.values())`
2. Creating a new Array using spread operator (`...`): `new Array(...map.values())`

**Comparison of Approaches**

### 1. `Array.from()` approach

Pros:

* More concise and expressive syntax
* Often considered more "JavaScript-like" as it's part of the language's standard library since ES6
* May be optimized by modern browsers for better performance

Cons:

* Might have slower execution time compared to other approaches due to additional overhead (e.g., function call, array creation)
* Not all JavaScript engines may optimize this approach equally well

### 2. Spread operator (`...`) approach

Pros:

* Can be faster in some cases due to reduced overhead and possible optimization by browsers
* Still a concise syntax that's widely used and understood
* Works with older JavaScript engines that don't support `Array.from()`

Cons:

* Requires explicit creation of an array, which can lead to additional allocation and copying of data
* May not be as "JavaScript-like" in its syntax compared to `Array.from()`

**Library Usage**

None of the test cases use any external libraries. The benchmark only relies on built-in JavaScript features.

**Special JS Features/Syntax**

The test case uses the spread operator (`...`) and `Array.from()` methods, both of which are standard JavaScript features since ES6. No other special features or syntax are used in this benchmark.

**Other Alternatives**

If you need to convert a Map object into an array, there are other approaches besides these two:

* Using `for...in` loop: `var arr = []; for (var key in map) arr.push(map.get(key))`
* Using `Object.values()` method (introduced in ES6): `Array.from(Object.values(map))`

However, the spread operator (`...`) and `Array.from()` approaches are generally considered the most concise and efficient ways to achieve this conversion.

I hope this explanation helps!

Related benchmarks:

Map -> Array (version: 0)

Comparing performance of: From vs New

Created: one year ago by: Guest

Jump to the latest result

From

New

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 6 months ago):