Benchmark: Array fill vs Array from vs for-loop

Tests:

For Loop
let arrayTest = new Array(10000000); for (let i = 0; i < arrayTest.length; i++){ arrayTest[i] = 0; }
Array Fill
let arrayTest = new Array(10000000).fill(0);
Array From
let arrayTest = Array.from({length: 10000000}, () => 0);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
For Loop
Array Fill
Array From

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 132 on Windows

View result in a separate tab

Test name	Executions per second
For Loop	29.6 Ops/sec
Array Fill	27.7 Ops/sec
Array From	1.6 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 provided benchmark definition and test cases to understand what is being tested.

**Benchmark Definition**
The benchmark measures the performance of three approaches to fill an array with zeros: a traditional `for` loop, the `Array.prototype.fill()` method, and the `Array.from()` method.

**Options Compared**

1. **For Loop**: A traditional approach using a `for` loop to iterate over the length of the array and assign a value (0) to each element.
	* Pros: Simple, easy to understand, and works across all browsers.
	* Cons: Can be slower due to the overhead of the loop and variable assignments.
2. **Array Fill**: Using the `Array.prototype.fill()` method to fill the entire array with zeros in one operation.
	* Pros: Fast, concise, and widely supported (most modern browsers).
	* Cons: May not work in older browsers or those that don't support this method.
3. **Array From**: Using the `Array.from()` method combined with an arrow function to create a new array filled with zeros.
	* Pros: Fast, concise, and widely supported (most modern browsers).
	* Cons: May be slower due to the creation of a new array and the overhead of the arrow function.

**Library Used**
None. The benchmark uses native JavaScript methods and doesn't rely on any external libraries.

**Special JS Feature/Syntax**
The `Array.from()` method is used, which is a modern JavaScript feature introduced in ECMAScript 2015 (ES6). It's also used with an arrow function, which is another modern syntax feature. However, the benchmark should work even without these features for compatibility reasons.

**Other Alternatives**

1. **Manual Array Creation**: Creating an array using the `new Array()` constructor and assigning values to each element manually.
2. **Loops in Other Languages**: Implementing a loop in other languages like C++ or Java, which could be compiled to JavaScript and executed.
3. **GPU Acceleration**: Using WebGL or WebGPU APIs to accelerate the array fill operation on the GPU.

In summary, the benchmark compares three approaches to filling an array with zeros: traditional `for` loops, the `Array.prototype.fill()` method, and the `Array.from()` method combined with an arrow function. The options compared offer a balance between performance, conciseness, and compatibility across different browsers and devices.

Related benchmarks:

Array fill vs Array from vs for-loop (version: 0)

Array fill vs Array from vs for-loop performance validation

Comparing performance of: For Loop vs Array Fill vs Array From

Created: 3 years ago by: Guest

Jump to the latest result

For Loop

Array Fill

Array From

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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