Benchmark: Array.from() vs new A

Tests:

new Array()
new Array(500)
Array.from()
Array.from({ length: 500 })

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
new Array()
Array.from()

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36

Browser/OS: Chrome 119 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
new Array()	3956551.8 Ops/sec
Array.from()	80311.7 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

**What is being tested?**

The provided benchmark tests two approaches to creating filled arrays:

1. `new Array(500)`: This method creates an array with 500 elements, all initialized to `undefined`.
2. `Array.from({ length: 500 })`: This method creates a new array by converting the object `{ length: 500 }` into an array.

**Options being compared**

The two options are compared in terms of their performance, which is measured by the number of executions per second (ExecutionsPerSecond).

**Pros and Cons of each approach**

1. `new Array(500)`:
	* Pros: Simple, widely supported, and easy to understand.
	* Cons: May not be as efficient as other methods, especially for large arrays, since it creates a new array object with 500 elements.
2. `Array.from({ length: 500 })`:
	* Pros: More modern and efficient approach, as it leverages the optimized `Array.from()` method in JavaScript engines. This method also avoids creating unnecessary objects or garbage.
	* Cons: Requires support for the `Array.from()` method in older browsers or environments.

**Library used**

In this benchmark, there is no explicit library being tested. However, the `Array.from()` method relies on a feature introduced in ECMAScript 2015 (ES6) and has been widely supported by modern browsers since then.

**Special JS feature/syntax**

The use of `Array.from({ length: 500 })` requires knowledge of ES6 features, specifically the spread operator (`{ ... }`) and the `Array.from()` method. This syntax is not widely supported in older JavaScript environments or browser versions prior to Chrome 33 (released in 2015).

**Other alternatives**

If `new Array(500)` were not being used, other alternative approaches could include:

1. Using a array literal with 500 elements: `[...new Array(500)]`
2. Creating an array using the `Array()` constructor and then filling it with values
3. Using a library like Lodash or Ramda to create an array

However, these alternatives are not being tested in this specific benchmark.

I hope this explanation helps software engineers understand what's happening behind the scenes of this JavaScript microbenchmark!

Related benchmarks:

Array.from() vs new A (version: 0)

Testing the difference between creating filled arrays.

Comparing performance of: new Array() vs Array.from()

Created: one year ago by: Guest

Jump to the latest result

new Array()

Array.from()

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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