Benchmark: Array fill method vs for loop

Tests:

For Loop fill
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);

Historical Performance Data aggregated from 145 community runs

Desktop Results:

Chrome 104 runs

For Loop fill

41/s

Array Fill

39/s

View exact numbers

✓ For Loop fill: 41 ops/sec
• Array Fill: 39 ops/sec

Firefox 35 runs

Array Fill

8/s

For Loop fill

8/s

View exact numbers

✓ Array Fill: 8 ops/sec
• For Loop fill: 8 ops/sec

Mobile Results:

Chrome 6 runs

Array Fill

19/s

For Loop fill

18/s

View exact numbers

✓ Array Fill: 19 ops/sec
• For Loop fill: 18 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
For Loop fill
Array Fill

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 18 days ago)

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

Browser/OS: Chrome 152 on Windows

View result in a separate tab

For Loop fill

29/s

Array Fill

26/s

View exact numbers

Test name	Executions per second
✓ For Loop fill	29 Ops/sec
Array Fill	26 Ops/sec

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

LLMs can make mistakes. Check important info.

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

**Benchmark Overview**

The provided benchmark compares two approaches to filling an array with zeros: a traditional `for` loop and the `fill()` method.

**Approaches Compared**

1. **For Loop**: This approach uses a manual loop to iterate over each element in the array, assigning a value of 0 to each one.
2. **Array Fill**: This approach utilizes the `fill()` method, which is a built-in JavaScript function that fills all elements of an array with a specified value.

**Pros and Cons**

**For Loop:**

Pros:

* Well-known and widely supported syntax
* Provides control over individual element assignments
* Can be modified to suit specific use cases

Cons:

* Inefficient for large arrays, as it requires multiple assignments per iteration
* Can lead to slower performance compared to modern array methods

**Array Fill:**

Pros:

* Fast and efficient, as it leverages the browser's engine optimizations
* Simplifies code and reduces maintenance overhead
* Supports filling with a single value or using a closure function for more complex scenarios

Cons:

* May not be compatible with older browsers or versions of JavaScript
* Less control over individual element assignments

**Library Used**

In this benchmark, no external libraries are used. The `fill()` method is a built-in JavaScript function that comes with the language.

**Special JS Feature/Syntax**

The benchmark does not require any special JavaScript features or syntax beyond what's commonly supported in modern browsers. However, it's worth noting that the `fill()` method was introduced in ECMAScript 2015 (ES6), so older browsers may not support it natively.

**Other Alternatives**

For filling arrays with zeros, other alternatives to the `for` loop and `fill()` method include:

1. **Array.prototype.map()`: While not the most efficient approach for large arrays, `map()` can be used in combination with `Array.from()` or `Array.prototype.slice()` to achieve similar results.
2. **Array.prototype.forEach()`: Similar to `map()`, `forEach()` can also be used to iterate over an array and assign values, but it's generally slower due to the overhead of function calls.

**Benchmark Preparation Code**

The provided benchmark preparation code is empty (`"Script Preparation Code": null`), which means that MeasureThat.net will automatically generate the necessary code for each test case based on the benchmark definition.

In summary, this benchmark compares two approaches to filling an array with zeros: a traditional `for` loop and the `fill()` method. The `fill()` method is generally faster and more efficient but may not be compatible with older browsers or versions of JavaScript.

Array fill method vs for loop (version: 0)

Array fill method vs for loop performance validation

Comparing performance of: `For Loop fill vs Array Fill`

Created: 5 years ago by: Registered User

Go to the latest result

For Loop fill

Array Fill

Historical Performance Data aggregated from 145 community runs

Desktop Results:

Chrome 104 runs

Firefox 35 runs

Mobile Results:

Chrome 6 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 fill method vs for loop (version: 0)

Array fill method vs for loop performance validation

Comparing performance of: For Loop fill vs Array Fill

Created: 5 years ago by: Registered User

Go to the latest result

For Loop fill

Array Fill

Historical Performance Data aggregated from 145 community runs

Desktop Results:

Chrome 104 runs

Firefox 35 runs

Mobile Results:

Chrome 6 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: `For Loop fill vs Array Fill`