Benchmark: Sorting array - MeasureThat.net

Tests:

Cut and move slices with .slice()
const array1 = ["a","b","c","x","d"]; const array2 = ["a","b","c","d","x"]; const array3 = ["a","x","b","c","d","e"]; const array4 = ["x","a","b","c","d","e"]; function reorderArray(array,itemIndex,newPosition) { const toFront = itemIndex > newPosition ? true : false; const a = toFront ? array.slice(0,newPosition) : array.slice(0,itemIndex); const b = toFront ? array.slice(newPosition,itemIndex) : array.slice(itemIndex,itemIndex+1); const c = toFront ? array.slice(itemIndex,itemIndex+1) : array.slice(itemIndex+1,newPosition+1); const d = toFront ? array.slice(itemIndex+1) : array.slice(newPosition+1); return [].concat(a, c, b, d); } const a = reorderArray(array1,3,1); const b = reorderArray(array2,4,0); const c = reorderArray(array3,1,3); const d = reorderArray(array4,0,1); const e = reorderArray(array4,0,0); console.log(a,b,c,d,e);
Mutate with .splice()
const array1 = ["a","b","c","x","d"]; const array2 = ["a","b","c","d","x"]; const array3 = ["a","x","b","c","d","e"]; const array4 = ["x","a","b","c","d","e"]; function arraymove(arr, fromIndex, toIndex) { const element = arr[fromIndex]; arr.splice(fromIndex, 1); arr.splice(toIndex, 0, element); } arraymove(array1,3,1); console.log(array1); arraymove(array2,4,0); console.log(array2); arraymove(array3,1,3); console.log(array3); arraymove(array4,0,1); console.log(array4); arraymove(array4,0,0); console.log(array4);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Cut and move slices with .slice()
Mutate with .splice()

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/114.0

Browser/OS: Firefox 114 on Windows

View result in a separate tab

Test name	Executions per second
Cut and move slices with .slice()	68999.9 Ops/sec
Mutate with .splice()	21817.4 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one month ago):

LLMs can make mistakes. Check important info.

I'll break down the provided benchmark and explain what's being tested, compared, and their pros and cons.

**Benchmark Overview**

The benchmark measures two approaches to sort an array: using JavaScript arrays' built-in `slice()` method and using the `splice()` method. The test creates four different input arrays with varying elements and then reorders them by removing elements from one end and inserting them at another end.

**Approach 1: Cut and move slices with `.slice()`**

This approach uses the `slice()` method to create new arrays for the removed and inserted parts of the original array. The resulting order is achieved by concatenating these three parts in a specific order.

```javascript
function reorderArray(array, itemIndex, newPosition) {
    const toFront = itemIndex > newPosition ? true : false;
    const a = toFront ? array.slice(0, newPosition) : array.slice(0, itemIndex);
    const b = toFront ? array.slice(newPosition, itemIndex) : array.slice(itemIndex, itemIndex + 1);
    const c = toFront ? array.slice(itemIndex, itemIndex + 1) : array.slice(itemIndex + 1, newPosition + 1);
    const d = toFront ? array.slice(itemIndex + 1) : array.slice(newPosition + 1);

return [].concat(a, c, b, d);
}
```

**Pros:**

*   Efficient and concise way to reorder arrays
*   Less likely to cause issues due to off-by-one errors

**Cons:**

*   May be slower than using `splice()` for very large arrays or complex reorders

**Approach 2: Mutate with `.splice()`**

This approach uses the `splice()` method to directly modify the original array, removing elements from one end and inserting them at another end.

```javascript
function arraymove(arr, fromIndex, toIndex) {
    const element = arr[fromIndex];
    arr.splice(fromIndex, 1);
    arr.splice(toIndex, 0, element);
}
```

**Pros:**

*   Can be faster than using `slice()` for very large arrays or complex reorders

**Cons:**

*   More error-prone and may cause issues with off-by-one errors
*   Changes the original array and can be problematic if the reordered elements are dependent on the original order

**Comparison**

The benchmark compares these two approaches to see which one is faster. The `Cut and move slices with .slice()` approach typically performs better than the `Mutate with .splice()` approach, especially for smaller arrays or simpler reorders.

**Library/ Framework Considerations**

There are no notable libraries or frameworks used in this benchmark. However, it's worth noting that some browsers may provide optimized implementations of these methods for specific use cases.

**Special JS Features/Syntax**

The benchmark does not include any special JavaScript features or syntax that would require a deeper explanation. The focus is on the basic array manipulation techniques.

**Alternatives**

Other alternatives to achieve similar results might involve using other data structures, such as linked lists or trees, or leveraging specialized libraries for array manipulation (e.g., `lodash` or `ramda`). However, these approaches are typically less efficient and more complex than the built-in methods used in this benchmark.

Related benchmarks:

Sorting array (version: 0)

Comparing performance of: Cut and move slices with .slice() vs Mutate with .splice()

Created: one year ago by: Registered User

Jump to the latest result

Cut and move slices with .slice()

Mutate with .splice()

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one month ago):