Benchmark: Underscore _.sortBy() vs Vanilla .sort() vs Vanilla CUSTOM sort method vs Vanille .sort() using localeCompare

HTML Preparation code:

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

Script Preparation code:

window.users = [
  { name: 'Ваня', level: '3' },
  { name: 'Саша', level: '1' },
  { name: 'Маша', level: '2' },
  { name: 'Ника', level: '3' },
  { name: 'Вера', level: '1' },
  { name: 'Саша', level: '2' },
  { name: 'Ваня', level: '2' }
];

window.sortBy = (key) => {
  return (a, b) => (a[key] > b[key]) ? 1 : ((b[key] > a[key]) ? -1 : 0);
};

function insertionSort(array, fieldName) {
  let { length } = array, items = [];
  let i, j, current;
  while (length--) {
    items[length] = array[length];
  }

  for (i = 1; i < length; i++) {
    current = items[i];
    j = i;
    while (j > 0 && getItem(items[j - 1], fieldName) > getItem(current, fieldName)) {
      items[j] = items[j - 1];
      j--;
    }
    items[j] = current;
  }
  return items;
}

function getItem(item, fieldName) {
  if (fieldName) {
    item = item[fieldName]
  }
  return item;
}

Tests:

Underscore sortBy()
_.sortBy(users, 'name')
Vanilla sort()
users.sort(sortBy("name"));
Vanilla CUSTOM sort method
insertionSort(users, "name");
localeCampare
users.sort((a, b) => a.name.localeCompare(b.name));

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Underscore sortBy()
Vanilla sort()
Vanilla CUSTOM sort method
localeCampare

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 131 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Underscore sortBy()	1510615.8 Ops/sec
Vanilla sort()	6172197.5 Ops/sec
Vanilla CUSTOM sort method	40543612.0 Ops/sec
localeCampare	2009632.8 Ops/sec

Autogenerated LLM Summary (model gemma2:9b, generated 6 months ago):

LLMs can make mistakes. Check important info.

This benchmark compares four different methods of sorting an array of user objects by their `name` property in JavaScript:

**Options Compared:**

1. **Underscore _.sortBy()**: This uses the `_.sortBy()` function from the Underscore.js library, a popular utility library for JavaScript. It provides a convenient and concise way to sort arrays based on one or more properties.

2. **Vanilla .sort() with custom comparison function**:  This method utilizes the built-in `sort()` method of arrays in JavaScript and passes a custom comparison function that defines how to compare elements. This approach gives you fine-grained control over the sorting logic.

3. **Vanilla CUSTOM sort method**: This test implements a basic insertion sort algorithm, which is a relatively simple sorting algorithm known for its performance in certain scenarios. It's defined within the benchmark code and directly compares objects based on the `name` property.

4. **Vanilla .sort() with localeCompare**:  This uses the built-in `localeCompare()` method to compare strings based on their locale, potentially handling different languages and character encodings more accurately.

**Pros and Cons:**

* **Underscore _.sortBy()**: 
    * **Pro**:  Very concise and readable syntax, leveraging a well-established library.
    * **Con**:  Requires including the Underscore.js library, which adds to bundle size and potential loading time.

* **Vanilla .sort() with custom comparison function**:
    * **Pro**:  Flexible control over sorting logic, allowing for complex comparisons or custom rules. 
    * **Con**: Can become more verbose than other options if the comparison logic is intricate.

* **Vanilla CUSTOM sort method (Insertion Sort)**:
    * **Pro**: Potentially efficient in certain cases, especially with small datasets or partially sorted data.
    * **Con**: Not always the most performant algorithm for large datasets; can be more complex to implement than other options.

* **Vanilla .sort() with localeCompare**:
    * **Pro**:  Handles locale-specific sorting for potentially more accurate results across different languages.
    * **Con**: Can be slightly slower than simpler comparison methods in some cases.

**Other Considerations:**

* **Dataset Size**: The performance of each method can vary significantly depending on the size of the dataset being sorted. 
* **Sorting Complexity**: If you need to sort based on multiple properties or apply complex sorting rules, a custom comparison function might be the most suitable option.

Let me know if you have any more questions!

Related benchmarks:

Underscore _.sortBy() vs Vanilla .sort() vs Vanilla CUSTOM sort method vs Vanille .sort() using localeCompare (version: 0)

Comparing performance of: Underscore sortBy() vs Vanilla sort() vs Vanilla CUSTOM sort method vs localeCampare

Created: 3 years ago by: Guest

Jump to the latest result

Underscore sortBy()

Vanilla sort()

Vanilla CUSTOM sort method

localeCampare

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gemma2:9b, generated 6 months ago):