Benchmark: Uint8Array.subarray vs Uint8Array.slice

Script Preparation code:

var bytes = [84,104,105,115,32,105,115,32,97,32,115,97,109,112,108,101,32,112,97,114,97,103,114,97,112,104,46];
var bufferArray = new Uint8Array(bytes);

Tests:

Uint8Array.subarray
bufferArray.subarray(3, 13);
Uint8Array.slice
bufferArray.slice(3, 13);

Historical Performance Data aggregated from 7 community runs

Desktop Results:

Firefox 7 runs

Uint8Array.slice

19.7M/s

Uint8Array.subarray

16.5M/s

Fastest: Uint8Array.slice (1.2x faster)

View exact numbers

✓ Uint8Array.slice: 19,680,396 ops/sec
• Uint8Array.subarray: 16,501,719 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Uint8Array.subarray
Uint8Array.slice

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Firefox 140 on Windows

View result in a separate tab

Uint8Array.slice

4.1M/s

Uint8Array.subarray

3.8M/s

View exact numbers

Test name	Executions per second
✓ Uint8Array.slice	4,135,539 Ops/sec
Uint8Array.subarray	3,788,178 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

LLMs can make mistakes. Check important info.

This benchmark compares two methods of extracting subarrays from a `Uint8Array` in JavaScript: `subarray` and `slice`. Both are commonly used for this purpose, but they operate slightly differently under the hood, which can impact performance.

### Methods Compared

1. **Uint8Array.subarray(start, end)**:
   - **Definition**: This method creates a new view on the original `Uint8Array`, sharing the underlying buffer. It does not copy the elements; instead, it creates a new view into the same buffer with the specified start and end indices.
   - **Performance**: Generally, `subarray` is faster since it avoids copying data. It merely establishes new start and end pointers.

2. **Uint8Array.slice(start, end)**:
   - **Definition**: This method creates a new `Uint8Array` that is a copy of a portion of the original array. It returns an entirely new array containing the elements from the start index up to, but not including, the end index.
   - **Performance**: `slice` can be slower because it involves allocating new memory and copying the data from the original array.

### Benchmark Results

The benchmark results indicate the two methods were executed numerous times (in hundreds of millions) to measure their performance:
- **Uint8Array.slice**: 32,084,342 executions per second.
- **Uint8Array.subarray**: 20,437,842 executions per second.

### Pros and Cons

#### Uint8Array.subarray

**Pros**:
- **Performance**: Generally faster due to shared buffer and no data copying.
- **Memory Efficiency**: Does not allocate new memory, which might be beneficial in scenarios with large datasets.

**Cons**:
- **Memory Management**: Because it shares the buffer, modifications to the original array will reflect in the `subarray`, which might lead to unintended side effects.
- **Limited Functionality**: Might not provide the same level of features as a fully copied array.

#### Uint8Array.slice

**Pros**:
- **Isolation**: Creates a unique copy, thus modifications to the new array do not affect the original.
- **Feature-Rich**: Can be used interchangeably with regular JavaScript array methods and behaviors, as it returns a new instance.

**Cons**:
- **Performance**: Slower due to the overhead of copying data.
- **Memory Usage**: More memory consumption, especially with large arrays.

### Other Considerations

- **Use Case**: If data integrity and independence are crucial (i.e., ensuring changes to one array do not affect the other), `slice` would be preferable despite the performance hit. If performance and memory conservation are more critical, `subarray` is the better choice.

- **Alternatives**: Besides `subarray` and `slice`, one might consider using other data structures or libraries depending on the specific needs. For example, typed arrays (like `Float32Array` or `Int32Array`) for numeric data, or more robust structures like `ArrayBuffer` if manipulation of raw binary data is required.

In summary, the benchmark provides insights into the performance characteristics of two different approaches to handling subarrays, allowing developers to make informed decisions based on their application requirements.

Uint8Array.subarray vs Uint8Array.slice (version: 1)

Comparing performance of: `Uint8Array.subarray vs Uint8Array.slice`

Created: one year ago by: Guest

Go to the latest result

Uint8Array.subarray

Uint8Array.slice

Historical Performance Data aggregated from 7 community runs

Desktop Results:

Firefox 7 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

Uint8Array.subarray vs Uint8Array.slice (version: 1)

Comparing performance of: Uint8Array.subarray vs Uint8Array.slice

Created: one year ago by: Guest

Go to the latest result

Uint8Array.subarray

Uint8Array.slice

Historical Performance Data aggregated from 7 community runs

Desktop Results:

Firefox 7 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

Related benchmarks

Comparing performance of: `Uint8Array.subarray vs Uint8Array.slice`