Benchmark: for vs foreach vs for..of finalboss

Script Preparation code:

var array = [
        { id: '1', label: 'Bread', type: 'First' },
        { id: '2', label: 'Cola', type: 'First' },
        { id: '3', label: 'Apple', type: 'Second' },
        { id: '4', label: 'Apple', type: 'Second' },
        { id: '5', label: 'Avocado' },
  		{ id: '1', label: 'Bread', type: 'First' },
        { id: '2', label: 'Cola', type: 'First' },
        { id: '3', label: 'Apple', type: 'Second' },
        { id: '4', label: 'Apple', type: 'Second' },
        { id: '5', label: 'Avocado' },
 		{ id: '11', label: 'Bread', type: 'First' },
        { id: '12', label: 'Cola', type: 'First' },
        { id: '13', label: 'Apple', type: 'Second' },
        { id: '14', label: 'Apple', type: 'Second' },
        { id: '15', label: 'Avocado' },
 		{ id: '21', label: 'Bread', type: 'First' },
        { id: '22', label: 'Cola', type: 'First' },
        { id: '23', label: 'Apple', type: 'Second' },
        { id: '24', label: 'Apple', type: 'Second' },
        { id: '25', label: 'Avocado' },
 		{ id: '31', label: 'Bread', type: 'First' },
        { id: '42', label: 'Cola', type: 'First' },
        { id: '43', label: 'Apple', type: 'Second' },
        { id: '44', label: 'Apple', type: 'Second' },
        { id: '45', label: 'Avocado' },
  		{ id: '41', label: 'Bread', type: 'First' },
        { id: '42', label: 'Cola', type: 'First' },
        { id: '43', label: 'Apple', type: 'Second' },
        { id: '44', label: 'Apple', type: 'Second' },
        { id: '45', label: 'Avocado' }
    ]

Tests:

for
const groups = {}; for (var item = 0; i < array.length; item++) { const itemGroup = item['type'] ?? 'notGrouped'; if (!groups[itemGroup]) { groups[itemGroup] = []; } groups[itemGroup].push(item); }
foreach
const groups = {}; array.forEach(item => { const itemGroup = item['type'] ?? 'notGrouped'; if (!groups[itemGroup]) { groups[itemGroup] = []; } groups[itemGroup].push(item); });
for..of
const groups = {}; for (var item of array) { const itemGroup = item['type'] ?? 'notGrouped'; if (!groups[itemGroup]) { groups[itemGroup] = []; } groups[itemGroup].push(item); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
foreach
for..of

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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!

**What is being tested?**

MeasureThat.net is testing the performance of three different loop constructs: `for`, `foreach`, and `for..of`. The loops are designed to group array elements by their `type` property, which appears in some of the objects within the `array`.

**Options compared**

The options being compared are:

1. **Traditional `for` loop**: This is a classic loop construct that uses an index variable (`item`) and checks against the array length.
2. **`foreach` loop**: This loop construct iterates over the array elements using a foreach iterator, which provides an implicit way to access each element's value.
3. **`for..of` loop**: This is a newer loop construct introduced in modern JavaScript (ES6+), which allows iterating over iterable objects using an explicit `for` loop syntax.

**Pros and Cons of each approach**

1. **Traditional `for` loop**:
	* Pros: Simple, easy to understand, and works well for simple loops.
	* Cons: Can be slow due to the need to manually increment the index variable.
2. **`foreach` loop**:
	* Pros: Convenient, easy to use, and provides an implicit way to access each element's value.
	* Cons: May introduce performance overhead due to the creation of a foreach iterator.
3. **`for..of` loop**:
	* Pros: Modern, efficient, and eliminates the need for manual index management.
	* Cons: Requires support for modern JavaScript (ES6+), and may not be as straightforward to understand for older developers.

**Library usage**

In this benchmark, the `forEach` loop uses a built-in array method (`forEach`) provided by the browser's implementation of ECMAScript. Similarly, the `for..of` loop leverages the new `for...of` loop syntax introduced in modern JavaScript.

**Special JS feature or syntax**

There is no specific special JS feature or syntax used in this benchmark other than the new `for..of` loop construct.

**Other alternatives**

For comparison, MeasureThat.net might also consider testing the following:

1. **Manual indexing**: Using a traditional `for` loop with manual index management (e.g., `item = 0; while (item < array.length) { ... }`)
2. **Lodash's `forEach` function**: Lodash provides an implementation of `forEach` as a utility function, which might be used for benchmarking purposes.
3. **Iterators**: Using iterators to iterate over the array elements, which could provide additional performance optimizations or trade-offs.

Keep in mind that the specific alternatives and their pros/cons will depend on the goals of the benchmark and the JavaScript implementation being targeted.

Related benchmarks:

for vs foreach vs for..of finalboss (version: 0)

Compare loop performance

Comparing performance of: for vs foreach vs for..of

Created: 2 years ago by: Guest

Jump to the latest result

for

foreach

for..of

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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