Benchmark: slice vs subarray vs ArrayBuffer copy

Script Preparation code:

var data = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
var f32 = new Float32Array(data);

Tests:

subarray direct
var copy = f32.subarray(10, 16);
slice direct
var copy = f32.slice(10, 16);
ArrayBuffer copy
var copy = new Float32Array(f32.buffer, 10*4, 6);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
subarray direct
slice direct
ArrayBuffer copy

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) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36 Edg/129.0.0.0

Browser/OS: Chrome 129 on Windows

View result in a separate tab

Test name	Executions per second
subarray direct	6522495.0 Ops/sec
slice direct	6380646.0 Ops/sec
ArrayBuffer copy	3564905.2 Ops/sec

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

LLMs can make mistakes. Check important info.

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

**Benchmark Test Case:**

The test case measures the performance of different approaches for copying a subset of data from an array:

1. `subarray` method
2. `slice` method
3. Creating a new `Float32Array` instance using the original array's buffer

**What is being tested?**

Each approach is compared to determine which one is fastest in terms of execution time.

**Options Compared:**

1. **subarray direct**: This involves creating a new subarray within the existing `Float32Array` instance, without allocating a new buffer or copying data.
2. **slice direct**: Similar to `subarray`, but using the `slice` method to create a new array view of the original data.
3. **ArrayBuffer copy**: Creating a new `Float32Array` instance by passing the original array's buffer and specifying the starting offset and length.

**Pros and Cons:**

1. **subarray direct**:
	* Pros: Fastest in terms of execution time, as it only requires creating a new subarray within the existing buffer.
	* Cons: Can be slower than `slice` if the original array is large and needs to be sliced multiple times, as this can lead to excessive copying within the browser's memory manager.
2. **slice direct**:
	* Pros: Slightly faster than `subarray` due to its optimized implementation, but still requires allocating a new buffer or copying data.
	* Cons: May incur additional overhead if the original array is large and needs to be sliced multiple times.
3. **ArrayBuffer copy**:
	* Pros: Can be faster in some cases, as it allows the browser to allocate a new buffer and copy data from the original array in a single operation.
	* Cons: Requires more memory allocation and copying than `subarray` or `slice`, making it slower for small arrays.

**Library/Feature Used:**

None specific, but the benchmark uses the built-in JavaScript APIs (`Float32Array`, `subarray`, `slice`, `ArrayBuffer`) without any external libraries.

**Special JS Feature/Syntax:**

The benchmark does not use any special JavaScript features or syntax beyond what's commonly available in modern browsers. However, it relies on a few advanced concepts:

* Buffers and arrays as typed data structures
* Views (subarrays and slices) for accessing parts of an array
* ArrayBuffer creation and management

**Other Alternatives:**

Some alternative approaches that could be tested instead of `subarray`, `slice`, or `ArrayBuffer copy` include:

* Using `TypedArray.prototype.set()` to set values in a new array, followed by copying the data from an existing array.
* Creating a custom function to manually iterate over the original array and allocate memory for the new array using `Uint8Array` or another typed array type.

These alternatives could provide interesting variations on the benchmark results, but would likely require more complex implementation and potentially different optimization strategies.

Related benchmarks:

slice vs subarray vs ArrayBuffer copy (version: 0)

Comparing performance of: subarray direct vs slice direct vs ArrayBuffer copy

Created: one year ago by: Guest

Jump to the latest result

subarray direct

slice direct

ArrayBuffer copy

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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