Benchmark: Pack array of bitmasks (numbers) to base64

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

function generateBitmasks() {
  const bitmasks = new Set();

  bitmasks.add(0);
  bitmasks.add(1);
  bitmasks.add(0xFF);       // 8 bits
  bitmasks.add(0xFFFF);     // 16 bits
  bitmasks.add(0xFFFFFF);   // 24 bits
  bitmasks.add(0xFFFFFFFF); // 32 bits

  for (let i = 0; i < 31; i++) {
    bitmasks.add(1 << i);
  }

  bitmasks.add(0x12345678);
  bitmasks.add(0x55555555);
  bitmasks.add(0xAAAAAAAA);
  bitmasks.add(0x33333333);
  bitmasks.add(0xCCCCCCCC);

  return Array.from(bitmasks)
}

var bitmasks = generateBitmasks();
var packed = packBitmasks(bitmasks);


function packBitmasks(bitmasks) {
  const buffer = new ArrayBuffer(bitmasks.length * 4);
  const uint32View = new Uint32Array(buffer);
  for (let i = 0; i < bitmasks.length; i++) {
    uint32View[i] = bitmasks[i];
  }
  const uint8View = new Uint8Array(buffer);
  const binary = String.fromCharCode.apply(null, uint8View);
  return btoa(binary);
}

function unpackBitmasks(packed) {
  const binary = atob(packed);
  const count = binary.length >>> 2;
  const result = new Array(count);
  for (let i = 0, offset = 0; i < count; i++, offset += 4) {
    result[i] =
      (
        binary.charCodeAt(offset) |
        (binary.charCodeAt(offset + 1) << 8) |
        (binary.charCodeAt(offset + 2) << 16) |
        (binary.charCodeAt(offset + 3) << 24)
      ) >>> 0;
  }
  return result;
}

Tests:

Pack
packBitmasks(bitmasks)
UnPack
unpackBitmasks(packed)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Pack
UnPack

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36

Browser/OS: Chrome 134 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Pack	1121335.1 Ops/sec
UnPack	2502285.0 Ops/sec

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

LLMs can make mistakes. Check important info.

The benchmark defined in the provided JSON assesses the performance of two specific functions: `packBitmasks` and `unpackBitmasks`. Both functions are aimed at manipulating an array of bitmasks (represented as integers) and encoding/decoding these values to and from a Base64 representation, which is a common method for representing binary data in an ASCII string format.

### Test Cases

1. **Packing Bitmasks (`packBitmasks(bitmasks)`):**
   - **Purpose:** This function takes an array of integers (bitmasks) and converts it into a single Base64-encoded string. It does this by first creating an `ArrayBuffer` to hold the numerical data in binary form, which is then read as a byte array using `Uint8Array`, converted to a binary string, and finally encoded to Base64 using the `btoa` function.
   
   - **Pros:**
     - Efficient memory management by using `ArrayBuffer`.
     - Compact representation of the bitmasks through Base64 encoding, making it potentially easier to transmit or store.
  
   - **Cons:**
     - Base64 encoding increases the size of the data. This can lead to a 33% increase in size compared to the original binary representation.
     - The additional overhead of creating a string and applying encoding.

2. **Unpacking Bitmasks (`unpackBitmasks(packed)`):**
   - **Purpose:** This function takes a Base64-encoded string and converts it back into an array of integers. It decodes the Base64 string to a binary string using `atob`, then reconstructs the integers by reading chunks of data and combining bytes.
   
   - **Pros:**
     - Allows for the retrieval of the original array of integers from a compact format.
     - Uses established encoding/decoding mechanisms that are part of the JavaScript standard.
  
   - **Cons:**
     - The decoding process is dependent on string manipulation, which can be less efficient compared to directly handling binary data.
     - Potential performance overhead from the repeated character manipulation and shifting in the unpacking loop.

### Libraries and Features

- **Typed Arrays:** The implementation utilizes `ArrayBuffer` and `Uint32Array`, which are part of the Typed Arrays feature in JavaScript. Typed Arrays allow for the manipulation of binary data in a structured way, providing better performance and memory efficiency, especially when dealing with large datasets.

- **Base64 Encoding:** The functions make use of JavaScript’s built-in `btoa` and `atob` functions for Base64 encoding and decoding. These functions convert binary data to an ASCII string format, which is useful for data transmission over channels that only support text.

### Alternatives

1. **Direct Binary Encoding:** Instead of converting to Base64, one could store or transmit the binary data directly, which would reduce the additional overhead introduced by Base64 encoding. This could be done using `ArrayBuffer` alone when performance is critical, but it would lack the portability of ASCII representation.

2. **JSON Serialization:** For cases where the size overhead of Base64 is unacceptable, and the data fits well within the text constraints, one could serialize the data as JSON. However, JSON would typically result in larger payloads for integer arrays due to the inherent string formatting.

3. **Compression Techniques:** Applying a compression algorithm (like gzip) after packing could help mitigate the increased size from Base64. This is a more complex approach but could be useful in scenarios where bandwidth is limited.

4. **Various Encoding Libraries:** For applications requiring more control or specific features, libraries such as `base64-js` can be employed. These libraries often provide more optimized methods for handling binary data and encoding/decoding processes.

### Conclusion

This benchmark tests the performance of packing and unpacking a collection of bitmasks into and from a Base64 string format using JavaScript’s built-in capabilities. The pros and cons of each approach highlight considerations regarding data size, efficiency, and portability. Alternative methods exist that trade off between ease of use and performance, leading developers to choose based on their specific use cases.

Related benchmarks:

Pack array of bitmasks (numbers) to base64 (version: 1)

Comparing performance of: Pack vs UnPack

Created: one month ago by: Registered User

Jump to the latest result

Pack

UnPack

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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