<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>
var arr = [
{
"id": 3,
"name": "Поездка с животным",
"desc": "",
"order_by": 9,
"disabled": "0"
},
{
"id": 4,
"name": "Машина без брендирования",
"desc": "",
"order_by": 2,
"disabled": "0"
},
{
"id": 9,
"name": "Брендированная (зелёная) машина",
"desc": "",
"order_by": 1,
"disabled": "0"
},
{
"id": 12,
"name": "Квитанция об оплате",
"desc": "",
"order_by": 6,
"disabled": "0"
},
{
"id": 15,
"name": "Проезд по КАД",
"desc": "",
"order_by": 11,
"disabled": "0"
},
{
"id": 16,
"name": "Проезд по КАД через Кронштадт",
"desc": "",
"order_by": 12,
"disabled": "0"
},
{
"id": 17,
"name": "Молчаливый водитель",
"desc": "",
"order_by": 10,
"disabled": "0"
},
{
"id": 19,
"name": "Деликатное вождение",
"desc": "",
"order_by": 7,
"disabled": "0"
},
{
"id": 38,
"name": "Данные для пропуска",
"desc": "",
"order_by": 36,
"disabled": "0"
},
{
"id": 95,
"name": "Помощь водителя",
"desc": "",
"order_by": 32,
"disabled": "0"
},
{
"id": 98,
"name": "Экспедирование",
"desc": "",
"order_by": 35,
"disabled": "0"
},
{
"id": 100,
"name": "Страховка груза",
"desc": "",
"order_by": 0,
"disabled": "0"
},
{
"id": 101,
"name": "Упаковка XS",
"desc": "1 стрейч (2кг)",
"order_by": 37,
"disabled": "0"
}
]
_.sortBy(arr, "order_by");
arr.sort((a, b) =>Number.parseInt(a.order_by) - Number.parseInt(b.order_by));
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
sortBy(arr, "order_by") | |
arr sort |
Test name | Executions per second |
---|---|
sortBy(arr, "order_by") | 479538.6 Ops/sec |
arr sort | 291705.2 Ops/sec |
I'll do my best to explain the benchmark and its results.
Benchmark Overview
The benchmark measures the performance of two approaches for sorting an array of objects:
sortBy
function with a custom compare function.Array.sort()
method.Lodash sortBy
Approach
In this approach, the sortBy
function is used to sort the arr
array based on the order_by
property of each object. The custom compare function is used to determine the order of two objects in the sorted array.
The Lodash sortBy
function is a utility function that takes an array and a compare function as input. It returns a new sorted array based on the comparison function. In this case, the comparison function is simply returning the difference between the order_by
values of two objects.
Array.sort() Approach
In this approach, the Array.sort()
method is used to sort the arr
array. The sorting algorithm used by the browser's JavaScript engine is not explicitly specified in the benchmark results. However, it is likely that the V8 JavaScript engine (used by Chrome) uses a variation of the merge sort or insertion sort algorithm.
Comparison
The two approaches have different performance characteristics:
sortBy
approach:Device-Specific Optimizations
The benchmark results show that both approaches are executed at a high rate on Chrome 97 on desktop devices. However, the Lodash sortBy
approach has slightly higher execution rates than the Array.sort() approach. It is likely that the browser's JavaScript engine has optimized the sorting algorithm for this specific use case.
Other Considerations
There are other factors to consider when evaluating the performance of these two approaches:
Array
object.sortBy
function is typically larger and more complex than the simple sorting algorithm used by Array.sort().Alternatives
If you need to sort an array of objects, other alternatives include: