Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
[...array].sort vs [...array].toSorted
(version: 1)
Comparing performance of:
[...array].sort vs array.toSorted
Created:
one year ago
by:
Guest
Go to the latest result
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>
Run tests (2)
Previous results
Fork
Test case name
Result
[...array].sort
array.toSorted
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one month ago
)
User agent:
Mozilla/5.0 (iPhone; CPU iPhone OS 18_7 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/26.5 Mobile/15E148 Safari/604.1
Browser/OS:
Mobile Safari 26 on iOS 18.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=632827" width="100%" height="500px"></iframe>
array.toSorted
811/s
[...array].sort
789/s
View exact numbers
Test name
Executions per second
✓
array.toSorted
811 Ops/sec
[...array].sort
789 Ops/sec
Autogenerated LLM Summary
(model
gpt-4o-mini
, generated one year ago):
This benchmark tests the performance of two different methods for sorting an array of random numbers in JavaScript: the traditional `Array.prototype.sort()` method and the newer `Array.prototype.toSorted()` method. ### Options Compared 1. **`[...array].sort(compareFn)`** - This approach creates a shallow copy of the array using the spread syntax (`[...]`) and then sorts it in place using the `Array.prototype.sort()` method. - **Mechanism**: The `sort()` method sorts the elements of the array in place and returns the sorted array. The `compareFn` is a function that defines the sort order. 2. **`array.toSorted(compareFn)`** - This method directly sorts the array using `toSorted()`, which is a newer addition to the JavaScript language. - **Mechanism**: `toSorted()` also accepts a compare function but creates and returns a new sorted array without modifying the original array. ### Pros and Cons #### `[...array].sort()` - **Pros**: - Widely supported across all JavaScript environments, making it a safe choice for compatibility. - **Cons**: - Modifies the array in place, which may lead to unintended side effects if the original array is still needed in its unsorted form. - Using the spread operator creates an intermediate array, which can be less efficient in terms of memory and performance. #### `array.toSorted()` - **Pros**: - Non-mutating: It doesn’t change the original array, which reduces the risk of side effects. - Can be more convenient when a non-destructive operation is desired. - **Cons**: - Being a newer feature (introduced in ECMAScript 2022), it may not be supported in very old browsers or environments that do not implement the latest JavaScript specifications. - Potentially less optimal performance in environments with older JavaScript engines. ### Performance Results The latest benchmark results show that `array.toSorted()` achieved **557.60 executions per second**, while `[...array].sort()` had **551.74 executions per second**. This indicates that `toSorted()` performs slightly better in this context, although the performance difference is marginal. ### Other Considerations When deciding which method to use, it's essential to consider: - Compatibility with the environments where the code will run. If you need to support legacy browsers, traditional `sort()` may be safer. - The need for immutability. If avoiding side effects is critical (e.g., in functional programming), `toSorted()` is preferable. - Depending on the specific use case, the performance difference may be negligible, so code readability and maintainability might take precedence. ### Alternatives 1. **`array.sort()` without copying**: If mutating the original array is not an issue, simply using `array.sort(compareFn)` will be the most straightforward approach. 2. **Using libraries**: Libraries like Lodash have their own sorting implementations which may provide additional features or optimizations. 3. **Custom Sorting Logic**: For more complex sorting scenarios, implementing a custom sorting algorithm (e.g., quicksort, mergesort) could be more efficient based on the specific data characteristics. In summary, both sorting approaches have their merits, and the choice depends on the specific context in which they're used. The introduction of `toSorted()` provides flexibility for developers who wish to avoid side effects and ensure immutability in their code.
Related benchmarks
math.min/max vs sort
[...array].sort vs array.toSorted
sort vs array.toSorted
array.sort vs array.toSorted
array.toSorted vs array.sort
JavaScript .sort() vs .toSorted ()vs [...].sort()
array.sort vs array.toSortedxx
[...array].sort vs array.toSorted short array
array.sort vs array.toSorted (2)
Comments
Confirm delete:
Do you really want to delete benchmark?