Benchmark: Uint8Array vs Uint8ClampedArray - more numbers

Script Preparation code:

var arr1 = new Uint8Array(1000);
var arr2 = new Uint8ClampedArray(1000);

Tests:

Uint8Array
for(let i = 0; i < 1000; i++) arr1[i] = i % 255 arr1[37] = arr1[732]
Uint8ClampedArray
for(let i = 0; i < 1000; i++) arr2[i] = i % 255 arr2[37] = arr2[732]

Historical Performance Data aggregated from 24 community runs

Desktop Results:

Chrome 18 runs

Uint8Array

26K/s

Uint8ClampedArray

26K/s

View exact numbers

✓ Uint8Array: 26,305 ops/sec
• Uint8ClampedArray: 26,167 ops/sec

Firefox 6 runs

Uint8Array

1.0M/s

Uint8ClampedArray

968K/s

View exact numbers

✓ Uint8Array: 1,043,502 ops/sec
• Uint8ClampedArray: 967,765 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
Uint8ClampedArray

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (iPhone; CPU iPhone OS 18_3_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) FxiOS/135.2 Mobile/15E148 Safari/605.1.15

Browser/OS: Mobile Safari 18 on iOS 18.3.1

View result in a separate tab

Uint8Array

1.9M/s

Uint8ClampedArray

1.3M/s

View exact numbers

Test name	Executions per second
✓ Uint8Array	1,865,071 Ops/sec
Uint8ClampedArray	1,346,273 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 provided JSON data and explain what's being tested in each benchmark.

**Benchmark Definition**

The `Script Preparation Code` section defines two variables, `arr1` and `arr2`, which are instances of `Uint8Array` and `Uint8ClampedArray`, respectively. Both arrays have a length of 1000 elements.

**Test Cases**

There are two individual test cases:

1. **Uint8Array**: The benchmark definition uses a traditional for loop to iterate over the array, assigning each index `i` to its corresponding value in the array using `arr1[i] = i % 255`. Additionally, it attempts to assign a value to an out-of-bounds index (`arr1[37] = arr1[732]`) to test how the engine handles this situation.
2. **Uint8ClampedArray**: The benchmark definition is identical to the first one, but uses `arr2` instead of `arr1`.

**Options Compared**

In this benchmark, two options are being compared:

*   `Uint8Array`: This type of array allows values to range from -128 to 127. It's a simple, basic type of array.
*   `Uint8ClampedArray`: This type of array is similar to `Uint8Array` but clamps values to the range [0, 255]. The difference here is that it prevents errors when trying to assign an index value larger than 255.

**Pros and Cons**

The pros of using a `Uint8Array` are:

*   It's simple and doesn't require any special handling.
*   It can store values within the range [-128, 127].

However, one con is that it can lead to unexpected behavior when trying to access an out-of-bounds index.

On the other hand, `Uint8ClampedArray` has a pro in that:

*   It prevents errors when trying to access an index value larger than 255.
*   However, its main drawback is that any values outside of [0, 255] are clamped.

Another con of `Uint8ClampedArray` is that it requires special handling for values outside the range [0, 255].

**Library and Purpose**

Neither `Uint8Array` nor `Uint8ClampedArray` use external libraries. They are built-in types in JavaScript that allow developers to work with binary data.

**Special JS Features or Syntax**

There are no special JS features or syntax used in these benchmark tests. The tests rely on the JavaScript runtime's behavior for arrays and basic operations.

**Other Alternatives**

If you want to compare other options, some alternatives could be:

*   `Int8Array` (a signed 8-bit integer array)
*   `Uint16Array` (an unsigned 16-bit integer array)
*   `Int16Array` (a signed 16-bit integer array)

Keep in mind that the behavior of these arrays can vary depending on the browser or JavaScript runtime being used.

**Benchmark Preparation Code**

The provided code snippet, "var arr1 = new Uint8Array(1000);\r\nvar arr2 = new Uint8ClampedArray(1000);", is a common way to prepare such benchmarks in JavaScript. These lines of code are executed before running the benchmark, and they create two arrays that can be used throughout the benchmark.

**Individual Test Cases**

The individual test cases use a traditional for loop to iterate over the array. The test cases also include assertions (in this case, `arr1[37] = arr1[732]`) to check if the values in the array are as expected.

By comparing these two arrays and their behaviors when using out-of-bounds indices, developers can better understand how JavaScript handles different data types and operations.

Uint8Array vs Uint8ClampedArray - more numbers (version: 0) Benchmark.js

Comparing performance of: `Uint8Array vs Uint8ClampedArray`

Created: 3 years ago by: Guest

Go to the latest result

Uint8Array

Uint8ClampedArray

Historical Performance Data aggregated from 24 community runs

Desktop Results:

Chrome 18 runs

Firefox 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Uint8Array vs Uint8ClampedArray - more numbers (version: 0) Benchmark.js

Comparing performance of: Uint8Array vs Uint8ClampedArray

Created: 3 years ago by: Guest

Go to the latest result

Uint8Array

Uint8ClampedArray

Historical Performance Data aggregated from 24 community runs

Desktop Results:

Chrome 18 runs

Firefox 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `Uint8Array vs Uint8ClampedArray`