Benchmark: array.sort vs array.toSortedxx

Script Preparation code:

var array = Array.from({ length: 10_000 }).map((_) => Math.random());
var compareFn = (a, b) => a - b

Tests:

[...array].sort
const result = array.sort(compareFn);
array.toSorted
const result = array.toSorted(compareFn)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
[...array].sort
array.toSorted

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 147 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
[...array].sort	4579.1 Ops/sec
array.toSorted	5510.2 Ops/sec

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

LLMs can make mistakes. Check important info.

The benchmark defined in the provided JSON compares two methods for sorting an array in JavaScript: `array.sort()` and the newly introduced `array.toSorted()`. Both methods are tested using a randomly generated array of 10,000 numbers.

### Comparison of Options

1. **`array.sort(compareFn)`**:
   - **Description**: This method sorts the array in place and modifies the original array. The `compareFn` function is used to define the sort order. In this case, it sorts the array in ascending order based on numerical values.
   - **Pros**: 
     - It's a well-established method that has been widely used in JavaScript for years.
     - Provides flexibility through the `compareFn`, allowing for complex sorting criteria.
   - **Cons**:
     - Since it alters the original array, it can lead to unintended side effects if the original order of the array needs to be maintained later in the program.

2. **`array.toSorted(compareFn)`**:
   - **Description**: Introduced in ECMAScript 2022, this method creates a new sorted array from the original without modifying it. Like `sort()`, it also accepts a `compareFn`.
   - **Pros**:
     - It preserves the original array, preventing side effects and making the code easier to reason about when the original order matters.
     - Can enhance readability, as it explicitly indicates that a new sorted array is being created.
   - **Cons**:
     - May involve slightly more overhead due to the necessity of creating a copy of the original array, which may affect performance in memory-constrained environments.

### Performance Results

From the benchmark results:
- `array.toSorted` achieved **3602.67 executions per second**.
- `[...array].sort` achieved **3048.75 executions per second**.

In this instance, `array.toSorted()` performed significantly better than `[...array].sort()`. This could be due to implementation optimizations in modern JavaScript engines for new methods. Still, performance will likely depend on the specific array content, size, and the JavaScript engine being used.

### Other Considerations

When considering which method to use in your code, the following factors might influence your decision:
- **Mutability vs Immutability**: If the behavior of maintaining the original array is critical, prefer `toSorted()`. Otherwise, `sort()` may be suitable for cases where performance is the utmost priority, and you can accept side effects.
- **Browser Support**: `array.toSorted()` is a newer addition; ensure that the targeted JavaScript environment supports it if it is being used across multiple browsers or versions.
  
### Alternatives

Besides `array.sort()` and `array.toSorted()`, there are other sorting alternatives you might consider:
- **Custom Sort Implementations**: Writing a custom sorting function (using algorithms like quicksort or mergesort) for specialized use cases or performance needs.
- **Libraries**: Utilizing libraries like Lodash or Underscore.js, which provide utility functions including sorting capabilities that can handle edge cases more seamlessly, albeit with an additional dependency.

Each approach has its intended use case, and the appropriate choice often depends on the specific requirements of the project at hand. Overall, understanding the differences in array manipulation methods like these can enhance code quality and lead to more efficient applications.

Related benchmarks:

array.sort vs array.toSortedxx (version: 1)

Comparing performance of: [...array].sort vs array.toSorted

Created: one year ago by: Guest

Jump to the latest result

[...array].sort

array.toSorted

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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