FileReader vs toBase64

Benchmark created on May 30, 2024

Setup

const rand = crypto.getRandomValues(new Uint8Array(65536))
const blob = Promise.resolve(new Blob(new Array(16).fill(rand)))
const toBase64 = (bytes) => {
    let binary = '';
    // Convert the bytes into a binary string, which we then call btoa on to base64-encode it.
    // Doing it 8 bytes at a time seems fastest, from experimentation.
    let i = 0;
    for (; i + 7 < bytes.byteLength; i += 8) {
        binary += String.fromCharCode(bytes[i], bytes[i + 1], bytes[i + 2], bytes[i + 3], bytes[i + 4], bytes[i + 5], bytes[i + 6], bytes[i + 7]);
    }
    for (; i < bytes.byteLength; i++) {
        binary += String.fromCharCode(bytes[i]);
    }
    return btoa(binary);
};

Test runner

blob
  .then(
    (blob) =>
      new Promise((resolve, reject) => {
        const reader = new FileReader();
        reader.onload = () => {
          resolve(reader.result);
        };
        reader.onerror = () => {
          reject(reader.error);
        };
        reader.readAsDataURL(blob);
      }),
  )
  .then(() => deferred.resolve());

blob
  .then((blob) => blob.arrayBuffer())
  .then((buffer) => {
    const base64 = toBase64(new Uint8Array(buffer));
    return `data:font/woff2;base64,${base64}`;
  })
  .then(() => deferred.resolve());

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

• Revision 1: published on May 30, 2024