Cyclic CA Spirals

const GW = 200, GH = 150;
const NSTATES = 16;
const THRESH = 1;
let a, b, off, octx, img, buf32, palette;
let acc = 0;
const stepMs = 1000 / 30;

function init() {
  a = new Uint8Array(GW * GH);
  b = new Uint8Array(GW * GH);
  for (let i = 0; i < a.length; i++) a[i] = (Math.random() * NSTATES) | 0;
  off = new OffscreenCanvas(GW, GH);
  octx = off.getContext("2d");
  img = octx.createImageData(GW, GH);
  buf32 = new Uint32Array(img.data.buffer);

  palette = new Uint32Array(NSTATES);
  for (let k = 0; k < NSTATES; k++) {
    const h = k / NSTATES;
    const s = 0.85, v = 1.0;
    const i = Math.floor(h * 6);
    const f = h * 6 - i;
    const pp = v * (1 - s);
    const q = v * (1 - f * s);
    const t = v * (1 - (1 - f) * s);
    let r, g, bl;
    switch (i % 6) {
      case 0: r = v; g = t; bl = pp; break;
      case 1: r = q; g = v; bl = pp; break;
      case 2: r = pp; g = v; bl = t; break;
      case 3: r = pp; g = q; bl = v; break;
      case 4: r = t; g = pp; bl = v; break;
      default: r = v; g = pp; bl = q; break;
    }
    const R = (r * 255) | 0, G = (g * 255) | 0, B = (bl * 255) | 0;
    palette[k] = (0xff << 24) | (B << 16) | (G << 8) | R;
  }
}

function step() {
  for (let y = 0; y < GH; y++) {
    const ym = (y - 1 + GH) % GH, yp = (y + 1) % GH;
    const row = y * GW, rowm = ym * GW, rowp = yp * GW;
    for (let x = 0; x < GW; x++) {
      const xm = (x - 1 + GW) % GW, xp = (x + 1) % GW;
      const k = a[row + x];
      const nxt = (k + 1) % NSTATES;
      let cnt = 0;
      if (a[rowm + xm] === nxt) cnt++;
      if (a[rowm + x] === nxt) cnt++;
      if (a[rowm + xp] === nxt) cnt++;
      if (a[row + xm] === nxt) cnt++;
      if (a[row + xp] === nxt) cnt++;
      if (a[rowp + xm] === nxt) cnt++;
      if (a[rowp + x] === nxt) cnt++;
      if (a[rowp + xp] === nxt) cnt++;
      b[row + x] = cnt >= THRESH ? nxt : k;
    }
  }
  const tmp = a; a = b; b = tmp;
}

function tick({ ctx, dt, width, height }) {
  acc += Math.min(0.05, dt) * 1000;
  let n = 0;
  while (acc >= stepMs && n < 3) { step(); acc -= stepMs; n++; }

  for (let i = 0; i < a.length; i++) buf32[i] = palette[a[i]];
  octx.putImageData(img, 0, 0);
  ctx.imageSmoothingEnabled = false;
  ctx.drawImage(off, 0, 0, width, height);
}