Benchmark: JS Loop Tests - MeasureThat.net

Script Preparation code:

var arr = new Array(1000000).fill(0)

Tests:

Map
arr.map(n => {});
forLoop
const length = arr.length; for (let i = 0; i < length; i++) {}
forEach
arr.forEach(n => {});
forOf
for (const num of arr) {}

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Map
forLoop
forEach
forOf

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark test cases.

**What is being tested?**

The benchmark tests various JavaScript loop constructs: `map`, `for` loops (with and without `const num of arr` syntax), and `forEach`. The goal is to compare the performance of these different loop approaches on a large array (`arr`) with 1 million elements, initialized with zeros.

**Options being compared**

The test cases compare:

1. **Map**: Uses the `map()` method to create a new array by applying a transformation function to each element.
2. **For Loop (Legacy)**: Uses a traditional `for` loop with an index variable (`i`) to iterate through the array.
3. **For Loop (New)**: Uses a `for...of` loop, which is a newer syntax that iterates over arrays without requiring an explicit index variable.
4. **ForEach**: Uses the `forEach()` method to execute a function on each element of the array.

**Pros and Cons**

Here's a brief summary of the pros and cons of each approach:

1. **Map**:
	* Pros: Efficient, concise, and easy to read.
	* Cons: Creates a new array, which can be memory-intensive for large datasets.
2. **For Loop (Legacy)**:
	* Pros: Classic, well-known syntax, and doesn't create a new array.
	* Cons: More verbose, requires manual index management, and can be slower due to the overhead of incrementing `i`.
3. **For Loop (New)**:
	* Pros: Improved readability, concise, and eliminates the need for an explicit index variable.
	* Cons: Requires modern JavaScript support, may have slower performance in older browsers.
4. **ForEach**:
	* Pros: Easy to read, concise, and doesn't require manual index management.
	* Cons: Creates a new proxy array, which can be memory-intensive for large datasets.

**Library usage**

None of the provided test cases explicitly use any external libraries, although `forEach()` method is an internal API in modern JavaScript.

**Special JS features or syntax**

The only special feature used in this benchmark is the **New For Loop Syntax (`for...of`)**, which was introduced in ECMAScript 2015 (ES6). This syntax allows iterating over arrays without requiring an explicit index variable.

**Other alternatives**

If you wanted to test alternative loop constructs, consider adding additional test cases for:

* `reduce()`
* `filter()`
* `some()` and `every()`
* Using native Web Workers or WebAssembly for parallelism

Keep in mind that these alternatives would require significant changes to the benchmark script and might not provide meaningful comparisons with the original tests.

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/119.0.0.0 Safari/537.36

Browser/OS: Chrome 119 on Windows

View result in a separate tab

Test name	Executions per second
Map	109.7 Ops/sec
forLoop	4482.2 Ops/sec
forEach	584.7 Ops/sec
forOf	303.1 Ops/sec

Related benchmarks:

JS Loop Tests (version: 4)

JS Memory Tests

Comparing performance of: Map vs forLoop vs forEach vs forOf

Created: one year ago by: Registered User

Jump to the latest result

Map

forLoop

forEach

forOf

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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