Benchmark: 100 array - MeasureThat.net

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

const array = [];
const indexes = [];
const l = 100;
const iterations = 100;


for (let i = 0; i < length; ++i) {
	array.push(Math.random());
}

for (let i = 0; i < iterations; ++i) {
	indexes.push(Math.floor(Math.random() * l));
}

Tests:

array.at(i)
let total = 0; for(let i = 0; i < iterations; ++i) { const index = indexes[i]; total += array.at(index); } console.log(total);
array[i]
let total = 0; for(let i = 0; i < iterations; ++i) { const index = indexes[i]; total += array[index]; } console.log(total);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
array.at(i)
array[i]

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 10 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36

Browser/OS: Chrome 137 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
array.at(i)	491736.7 Ops/sec
array[i]	526281.9 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 10 months ago):

LLMs can make mistakes. Check important info.

The benchmark defined by the JSON you provided is designed to test the performance of different ways to access elements in a JavaScript array. The focus is on two specific methods: using the standard bracket notation (`array[i]`) versus the `Array.prototype.at()` method (`array.at(i)`).

### Test Cases Explained

#### Test Case 1: `array.at(i)`
- **Benchmark Definition**: 
  ```javascript
  let total = 0;
  for(let i = 0; i < iterations; ++i) {
      const index = indexes[i];
      total += array.at(index);
  }
  console.log(total);
  ```
- **Description**: This test checks the performance of accessing elements in the array using the `Array.prototype.at()` method, which was introduced in ECMAScript 2022 (ES12). This method allows accessing array elements with the ability to use negative indices to count from the end of the array.

#### Test Case 2: `array[i]`
- **Benchmark Definition**: 
  ```javascript
  let total = 0;
  for(let i = 0; i < iterations; ++i) {
      const index = indexes[i];
      total += array[index];
  }
  console.log(total);
  ```
- **Description**: This test measures the traditional approach of accessing elements in an array using the bracket notation which has been the standard method in JavaScript since its inception.

### Comparison of Options

1. **Performance**: 
   - **Bracket Notation (array[i])**: In the results, it has a slight edge with 526,281.875 executions per second compared to `Array.prototype.at()` with 491,736.71875 executions per second. This indicates that accessing an array using bracket notation may be more optimized by JavaScript engines for direct access.
   - **Array.prototype.at()**: Although it's slightly slower in this benchmark, it offers semantic advantages (like handling negative indices).

2. **Pros and Cons**:
   - **Bracket Notation**:
     - **Pros**: 
       - Faster performance in this benchmark.
       - Widely supported and familiar, since it’s the traditional way of accessing array elements.
     - **Cons**: 
       - Lacks the advanced features like negative indexing seen in the `at()` method.
       
   - **Array.prototype.at()**:
     - **Pros**: 
       - Can handle negative indexing elegantly (e.g., `array.at(-1)` returns the last element).
       - More expressive for specific use cases where counting from the end is desirable.
     - **Cons**: 
       - Slightly slower performance.
       - Requires a more modern JavaScript environment for support.

### Other Considerations
- **Compatibility**: Both approaches (bracket notation and `at()`) are well supported in modern browsers, but developers should check compatibility if targeting older environments.
- **Readability**: Using `at()` can enhance code readability for certain scenarios, especially when dealing with negative indices.

### Other Alternatives
- For array access, developers could also consider:
  - **`Array.prototype.slice()`**: Useful for retrieving a sub-array.
  - **`Array.prototype.includes()` and `Array.prototype.indexOf()`**: For checking element existence or finding indices.
  
In summary, while `array[i]` shows marginally better performance in this particular benchmark, `array.at(i)` provides useful features that may make it more appropriate in scenarios where accessing the elements from the end of the array is desirable. Therefore, choice can depend on the specific needs of the application being developed.

Related benchmarks:

100 array (version: 1)

Comparing performance of: array.at(i) vs array[i]

Created: 10 months ago by: Guest

Jump to the latest result

array.at(i)

array[i]

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 10 months ago):