Benchmark: Native Array at vs Native Array length - 1 vs Lodash at

HTML Preparation code:

https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js

Script Preparation code:

var max1 = 100000; // 100,000 (100 Thousand)
var max2 = 10000000; // 10,000,000 (10 Million)
var max3 = 100000000; // 100,000,000 (100 Million)

var arr1 = [];
for (var i = 0; i <= max2; i++) {
    arr2.push(i);
}

Tests:

Native At
arr1.at(-1)
Lodash last
_.last(arr1)
Native length - 1
arr1[arr1.length - 1]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Native At
Lodash last
Native length - 1

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:129.0) Gecko/20100101 Firefox/129.0

Browser/OS: Firefox 129 on Ubuntu

View result in a separate tab

Test name	Executions per second
Native At	2123588608.0 Ops/sec
Lodash last	1067807040.0 Ops/sec
Native length - 1	31976566.0 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

LLMs can make mistakes. Check important info.

### Benchmark Overview

The benchmark compares three methods for retrieving the last element of an array in JavaScript, focusing on performance:

1. **Native `Array.prototype.at()` method** (`arr1.at(-1)`)
2. **Lodash's `_.last()` function** (`_.last(arr1)`)
3. **Native array access using length property** (`arr1[arr1.length - 1]`)

The benchmark measures the execution speed (in executions per second) of each method on a predefined array populated with integers.

### Methods Compared

1. **Native `at()` Method**:
   - **Description**: Introduced in ECMAScript 2022, the `at()` method allows for accessing elements from the end of an array using a negative index. For instance, `arr1.at(-1)` returns the last element.
   - **Performance**: As per the benchmark results, this method performed the best, with approximately 2.12 billion executions per second.
   - **Pros**:
     - Cleaner syntax for accessing elements from the end of arrays.
     - Improved readability and clarity in code.
   - **Cons**:
     - Compatibility concerns in environments that do not fully support ES2022 (although it's steadily gaining support).

2. **Lodash's `_.last()`**:
   - **Description**: Lodash is a popular JavaScript utility library that provides a range of functions for simplifying common programming tasks. The `_.last()` function specifically returns the last element of an array.
   - **Performance**: This approach had a performance of roughly 1.07 billion executions per second, making it slower than the native `at()` method but still efficient.
   - **Pros**:
     - Part of a larger toolkit of utility methods which can help streamline coding practices.
     - Familiarity and extensive usage in many projects.
   - **Cons**:
     - Adds additional overhead as the library must be included in the project.
     - The Lodash function calls may be less performant compared to native solutions.

3. **Direct Length Access**:
   - **Description**: This method accesses the last element by calculating the index with `length` property, i.e., `arr1[arr1.length - 1]`.
   - **Performance**: This was the slowest method in the benchmark with only about 31.9 million executions per second.
   - **Pros**:
     - Very traditional approach, widely understood by JavaScript developers.
     - No need for additional libraries; purely uses native JavaScript features.
   - **Cons**:
     - Less expressive and can be seen as more verbose compared to modern syntax.
     - Performance issues as indicated by test results.

### Conclusions and Considerations

- The benchmark solidly demonstrates that using modern JavaScript features, like `Array.prototype.at()`, offers significant improvements in performance, favoring clarity and efficiency.
- Lodash functions can be beneficial but may incur an overhead of including an entire library for such a simple utility.
- Direct length access is not recommended for performance-critical applications given the results.

### Alternatives

- Other alternatives could include using a traditional for-loop to iterate through arrays, using the spread operator with destructuring (`const lastElement = [...arr1].pop();`), or utilizing other frameworks/libraries like Underscore.js, though similar considerations regarding performance and overhead would apply.
- If working in a controlled environment where ES2022 support is guaranteed, `Array.prototype.at()` is likely the best route.
- For applications that already make heavy use of Lodash or other utility libraries, using `_.last()` could maintain code consistency, with acceptable performance trade-offs.

Related benchmarks:

Native Array at vs Native Array length - 1 vs Lodash at (version: 1)

Comparing performance of: Native At vs Lodash last vs Native length - 1

Created: one year ago by: Guest

Jump to the latest result

Native At

Lodash last

Native length - 1

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):