v149 · JavaScript

Uint8Array Base64 & Hex

Six new methods on Uint8Array for encoding and decoding binary data to and from base64 or hexadecimal strings — directly in JavaScript, no atob/btoa hacks and no libraries required.

concepts

  1. Encode & Decode

    Type or paste text and watch it encode to base64 via toBase64(), then decode back via fromBase64(). Round-trips arbitrary UTF-8 through a TextEncoder/TextDecoder pair and shows the intermediate byte array at every step.

  2. Hex Inspector

    Enter text and see each byte as a two-digit hexadecimal code using toHex(). Click any hex byte in the output to highlight the corresponding input character. Demonstrates the difference between ASCII and multi-byte UTF-8 sequences.

  3. URL-Safe Base64

    Compares standard base64 (alphabet A–Z a–z 0–9 + /) against URL-safe base64 (alphabet A–Z a–z 0–9 - _) using the alphabet: "base64url" option of toBase64(). Encodes sample tokens and shows where + and / would break a URL.

  4. Binary File Tools

    Drop a small file onto the page; the demo reads it as a Uint8Array, encodes to base64 with toBase64() and hex with toHex(), and renders both as a copyable data URL and a hex dump — all client-side, no server required.

  5. WebCrypto Round-Trip

    Encrypts a message with AES-256-GCM, then uses toBase64() to encode both the ciphertext and the random IV for safe transport. Paste the base64 strings back and fromBase64() reconstructs the raw bytes before decrypting — demonstrating the real-world security use case for the new methods.

  6. Streaming Chunks

    Uses setFromBase64() to decode a base64 payload chunk-by-chunk into a fixed-size pre-allocated buffer. Each call returns { read, written } — the number of source characters consumed and bytes produced — enabling precise streaming without over-allocating. Adjustable chunk size; verified round-trip on every run.

why it shipped

The platform has always had atob and btoa for base64, but they operate on Latin-1 strings and are string-in/string-out — converting arbitrary binary data required a multi-step dance with TextEncoder, typed arrays, and String.fromCharCode spread calls. Hex had no built-in support at all. The new Uint8Array methods are the result of a TC39 Stage 4 proposal (ECMAScript 2026) that treats binary ↔ text encoding as a first-class concern. They operate directly on byte arrays, accept options for alphabet and padding, and avoid the intermediate string allocation that made atob/btoa both awkward and slow on large payloads.

references

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗