Benchmark: Array.from() vs new Array()

Tests:

new Array()
new Array(500).fill(0, 0, 500)
Array.from()
Array.from({ length: 500 }, () => 0)

Historical Performance Data aggregated from 219 community runs

Desktop Results:

Chrome 172 runs

new Array()

1.9M/s

Array.from()

70K/s

Fastest: new Array() (27.3x faster)

View exact numbers

✓ new Array(): 1,912,112 ops/sec
• Array.from(): 70,106 ops/sec

Firefox 40 runs

new Array()

662K/s

Array.from()

371K/s

Fastest: new Array() (1.8x faster)

View exact numbers

✓ new Array(): 662,500 ops/sec
• Array.from(): 371,389 ops/sec

Safari 7 runs

new Array()

1.7M/s

Array.from()

822K/s

Fastest: new Array() (2.1x faster)

View exact numbers

✓ new Array(): 1,686,720 ops/sec
• Array.from(): 821,940 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

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 month ago)

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

Browser/OS: Chrome 149 on Windows

View result in a separate tab

new Array()

2.7M/s

Array.from()

73K/s

View exact numbers

Test name	Executions per second
✓ new Array()	2,677,257 Ops/sec
Array.from()	73,448 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into explaining the benchmark.

**What is being tested:**

The provided JSON represents a JavaScript microbenchmarking test, specifically comparing two methods to create filled arrays in JavaScript:

1. `new Array(500).fill(0, 0, 500)`
2. `Array.from({ length: 500 }, () => 0)`

These tests measure the performance difference between these two approaches.

**Options being compared:**

The main options being compared are:

* **Dynamic array creation:** `new Array(500).fill(0, 0, 500)` (first test case)
* **Array.from() with a callback function:** `Array.from({ length: 500 }, () => 0)` (second test case)

**Pros and Cons of each approach:**

1. **Dynamic array creation (`new Array()`):**
	* Pros:
		+ Simple and widely supported
		+ Can be faster for small arrays due to cache efficiency
	* Cons:
		+ Can lead to memory fragmentation issues if used extensively
		+ May not work correctly in older browsers
2. **Array.from() with a callback function:**
	* Pros:
		+ More efficient and scalable than dynamic array creation
		+ Supports modern JavaScript features (e.g., arrow functions)
	* Cons:
		+ Less supported by older browsers
		+ Can be slower for very large arrays due to additional overhead

**Other considerations:**

When choosing between these approaches, consider the specific use case and requirements. If you need a simple, lightweight solution for small arrays, `new Array()` might suffice. However, if you're working with larger datasets or require more flexibility, `Array.from()` with a callback function is likely a better choice.

**Library used:**

In this test, there are no external libraries explicitly mentioned. However, some modern JavaScript features (e.g., arrow functions) rely on additional libraries like Babel to support older browsers.

**Special JS feature or syntax:**

There are no special JS features or syntax specifically highlighted in this benchmark. The tests focus on the performance difference between two well-established array creation methods.

**Alternative approaches:**

If you need an alternative way to create arrays, consider using:

* **`Array.prototype.fill()`**: A more modern and efficient method for filling arrays.
* **`Array.from() without a callback function`**: You can use `Array.from()` with no callback function to create an empty array or fill it with primitive values (e.g., numbers).
* **Other libraries or modules**, such as `lodash`, which provide additional functions for working with arrays.

Keep in mind that these alternatives might not be specifically suited for the performance-critical scenario depicted in this benchmark.

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

Testing the difference between creating filled arrays.

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

Created: 5 years ago by: Guest

Go to the latest result

new Array()

Array.from()

Historical Performance Data aggregated from 219 community runs

Desktop Results:

Chrome 172 runs

Firefox 40 runs

Safari 7 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

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

Testing the difference between creating filled arrays.

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

Created: 5 years ago by: Guest

Go to the latest result

new Array()

Array.from()

Historical Performance Data aggregated from 219 community runs

Desktop Results:

Chrome 172 runs

Firefox 40 runs

Safari 7 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

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