Benchmark: vanilla vs lo-dash vs underscore sortBy()

HTML Preparation code:

<script src='https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

​x
 
​
<script src='https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

let fruits = [
  {name:"mango", amount: 1},
  {name:"apple", amount: 4},
  {name:"banana", amount: 2},
  {name:"pineapple", amount: 2},
  {name:"apple", amount: 2}
]

const sortBy = (key) => {
  return (a, b) => (a[key] > b[key]) ? 1 : ((b[key] > a[key]) ? -1 : 0);
};

fruits.sort(sortBy("name"));

 
let fruits = [  {name:"mango", amount: 1},  {name:"apple", amount: 4},  {name:"banana", amount: 2},  {name:"pineapple", amount: 2},  {name:"apple", amount: 2}]​const sortBy = (key) => {  return (a, b) => (a[key] > b[key]) ? 1 : ((b[key] > a[key]) ? -1 : 0);};​fruits.sort(sortBy("name"));

Tests:

Lo-Dash sortBy()

let fruits = [
  {name:"mango", amount: 1},
  {name:"apple", amount: 4},
  {name:"banana", amount: 2},
  {name:"pineapple", amount: 2},
  {name:"apple", amount: 2}
]
_.sortBy(fruits, 'name')

 
let fruits = [  {name:"mango", amount: 1},  {name:"apple", amount: 4},  {name:"banana", amount: 2},  {name:"pineapple", amount: 2},  {name:"apple", amount: 2}]_.sortBy(fruits, 'name')

Underscore sortBy()
let fruits = [ {name:"mango", amount: 1}, {name:"apple", amount: 4}, {name:"banana", amount: 2}, {name:"pineapple", amount: 2}, {name:"apple", amount: 2} ] _.sortBy(fruits, 'name')
let fruits = [
{name:"mango", amount: 1},
{name:"apple", amount: 4},
{name:"banana", amount: 2},
{name:"pineapple", amount: 2},
{name:"apple", amount: 2}
]
_.sortBy(fruits, 'name')

Vanilla sort()

let fruits = [
  {name:"mango", amount: 1},
  {name:"apple", amount: 4},
  {name:"banana", amount: 2},
  {name:"pineapple", amount: 2},
  {name:"apple", amount: 2}
]

const sortBy = (key) => {
  return (a, b) => (a[key] > b[key]) ? 1 : ((b[key] > a[key]) ? -1 : 0);
};

fruits.sort(sortBy("name"));

 
let fruits = [  {name:"mango", amount: 1},  {name:"apple", amount: 4},  {name:"banana", amount: 2},  {name:"pineapple", amount: 2},  {name:"apple", amount: 2}]​const sortBy = (key) => {  return (a, b) => (a[key] > b[key]) ? 1 : ((b[key] > a[key]) ? -1 : 0);};​fruits.sort(sortBy("name"));

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
Lo-Dash sortBy()
Underscore sortBy()
Vanilla sort()

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 55 minutes ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36 Edg/134.0.0.0

Browser/OS: Chrome 134 on Windows

View result in a separate tab

Test name	Executions per second
Lo-Dash sortBy()	1258222.4 Ops/sec
Underscore sortBy()	1256008.1 Ops/sec
Vanilla sort()	4037743.0 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 5 months ago):

Let's dive into the world of JavaScript microbenchmarks.

What is tested?

The provided JSON represents three benchmark test cases:

Vanilla sort(): This test case measures how fast JavaScript can sort an array using its built-in sort() method without any additional libraries or modifications.
Lo-Dash sortBy(): This test case uses the Lo-Dash library, which provides a functional programming style for working with arrays and other data structures. The sortBy() function is used to sort the array based on a specified key.
Underscore sortBy(): Similar to Lo-Dash, this test case uses the Underscore.js library, another popular JavaScript utility library that provides functions for common tasks like sorting.

Options compared

In each test case:

The same input data is used: an array of objects with a name property.
The sorting algorithm or function is different:
- Vanilla sort(): uses the built-in sort() method and its default comparison function.
- Lo-Dash sortBy(): uses the _sortBy() function from the Lo-Dash library, which takes an additional argument for the sorting key.
- Underscore sortBy(): uses the sortBy() function from the Underscore.js library, similar to Lo-Dash.
The test cases are run on different browsers (Firefox 129) and devices (Desktop).

Pros and Cons of each approach

Vanilla sort():
- Pros: Fastest execution time since it leverages the built-in sort() method, which is optimized for performance.
- Cons: May not be suitable for large datasets or complex sorting requirements due to its limited capabilities.
Lo-Dash sortBy() and Underscore sortBy():
- Pros:
  - More flexible and customizable than vanilla sort(), as they provide additional options for the sorting algorithm.
  - Useful when working with data structures that are not arrays or need more complex transformations.
- Cons:
  - Generally slower than vanilla sort(), due to the overhead of using a separate library function.

Special considerations

The RawUAString field in each benchmark result provides information about the browser and device running the test. This data can help identify any inconsistencies or differences between browsers.
There are no special JavaScript features or syntax used in these benchmarks, as they focus on comparing different sorting algorithms and libraries.

Alternatives

If you're interested in exploring other alternatives for sorting arrays, consider:

Lodash.js: The same library used in Lo-Dash sortBy(), but with additional features and a broader range of utility functions.
Moment.js: While not specifically designed for array sorting, Moment.js provides powerful date and time manipulation capabilities that can be adapted for custom sorting logic.

These alternatives might provide more flexibility or specific functionality tailored to your requirements. However, they may also introduce additional overhead or dependencies.

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

**What is tested?**

The provided JSON represents three benchmark test cases:

1. **Vanilla sort()**: This test case measures how fast JavaScript can sort an array using its built-in `sort()` method without any additional libraries or modifications.
2. **Lo-Dash sortBy()**: This test case uses the Lo-Dash library, which provides a functional programming style for working with arrays and other data structures. The `sortBy()` function is used to sort the array based on a specified key.
3. **Underscore sortBy()**: Similar to Lo-Dash, this test case uses the Underscore.js library, another popular JavaScript utility library that provides functions for common tasks like sorting.

**Options compared**

In each test case:

*   The same input data is used: an array of objects with a `name` property.
*   The sorting algorithm or function is different:
    *   Vanilla sort(): uses the built-in `sort()` method and its default comparison function.
    *   Lo-Dash sortBy(): uses the `_sortBy()` function from the Lo-Dash library, which takes an additional argument for the sorting key.
    *   Underscore sortBy(): uses the `sortBy()` function from the Underscore.js library, similar to Lo-Dash.
*   The test cases are run on different browsers (Firefox 129) and devices (Desktop).

**Pros and Cons of each approach**

1.  **Vanilla sort()**:
    *   Pros: Fastest execution time since it leverages the built-in `sort()` method, which is optimized for performance.
    *   Cons: May not be suitable for large datasets or complex sorting requirements due to its limited capabilities.

2.  **Lo-Dash sortBy() and Underscore sortBy()**:
    *   Pros:
        *   More flexible and customizable than vanilla sort(), as they provide additional options for the sorting algorithm.
        *   Useful when working with data structures that are not arrays or need more complex transformations.
    *   Cons:
        *   Generally slower than vanilla sort(), due to the overhead of using a separate library function.

**Special considerations**

*   The `RawUAString` field in each benchmark result provides information about the browser and device running the test. This data can help identify any inconsistencies or differences between browsers.
*   There are no special JavaScript features or syntax used in these benchmarks, as they focus on comparing different sorting algorithms and libraries.

**Alternatives**

If you're interested in exploring other alternatives for sorting arrays, consider:

1.  **Lodash.js**: The same library used in Lo-Dash sortBy(), but with additional features and a broader range of utility functions.
2.  **Moment.js**: While not specifically designed for array sorting, Moment.js provides powerful date and time manipulation capabilities that can be adapted for custom sorting logic.

These alternatives might provide more flexibility or specific functionality tailored to your requirements. However, they may also introduce additional overhead or dependencies.

Related benchmarks:

vanilla vs lo-dash vs underscore sortBy() (version: 0)

Comparing performance of: Lo-Dash sortBy() vs Underscore sortBy() vs Vanilla sort()

Created: 6 years ago by: Guest

Jump to the latest result