examples

compare random function performance

html

<div class="report">
  <div>
    <div>Math.random()</div>
    <pre data-r="mathCheck"></pre>
  </div>
  <div>
    <div>crypto.getRandomValues()</div>
    <pre data-r="cryptoCheck"></pre>
  </div>
</div>

javascript

export const b = { init: "mathCheck" };

const arraySize = 1000000;
const iterations = 5;

export async function cryptoCheck(_, __, el) {
  runTests(shuffleWithCrypto, el, "crypto");
}

export async function mathCheck(_, __, el) {
  await runTests(shuffleWithMath, el, "math");
  b.trigger("cryptoCheck");
}

export async function runTests(fn, el, kind) {
  const times = [];
  const items = new Array(arraySize);
  items.fill("the quick brown fox", 0, arraySize - 1);
  for (let iter = 0; iter < iterations; iter += 1) {
    const key = `${kind}${iter}`;
    b.mark(key);
    fn(items);
    b.mark(key);
    const time = parseInt(b.getMarks(key)[1] - b.getMarks(key)[0], 10);
    times.push(time);
    window.requestAnimationFrame(() => {
      el.innerHTML = `${el.innerHTML}\n${time}ms`;
    });
    await b.sleep(50);
  }
  el.innerHTML = `${el.innerHTML}\nAvg: ${
    times.reduce((acc, cur) => acc + cur, 0) /
    iterations
  }ms`;
}

function shuffleWithCrypto(array) {
  for (let i = array.length - 1; i >= 1; i--) {
    const r = new Uint32Array(1);
    crypto.getRandomValues(r);
    const j = r[0] % i;
    [array[i], array[j]] = [array[j], array[i]];
  }
}

function shuffleWithMath(array) {
  for (let i = array.length - 1; i >= 1; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [array[i], array[j]] = [array[j], array[i]];
  }
}