let numSamples = 30;

let frameRateSamples = [];

let frameRateSum = 0;

​

let size = 1;

let vMax = 5;

let nShapes = 20_000;

let shapes;

​

  function setup() {

  createCanvas(windowWidth, windowHeight - 40);

  frameRateP = createP();

  shapes = new Int16Array(nShapes * 4);

  for (let i = 0, k = 0; i < nShapes; i++) {

    shapes[k++] = random(width);       // x

    shapes[k++] = random(-vMax, vMax); // vx

    shapes[k++] = random(height);      // y

    shapes[k++] = random(-vMax, vMax); // vy

  }

}

​

function draw() {

  let newSample = frameRate();

  frameRateSamples.push(newSample);

  frameRateSum += newSample;

  if (frameRateSamples.length > numSamples) {

    frameRateSum -= frameRateSamples.shift();

  }

  frameRateP.html(round(frameRateSum / frameRateSamples.length));

  background(255);

  noStroke();

  fill(255, 0, 0);

  let wm1 = width - 1;

  let hm1 = height - 1;

  for (let i = 0, k = 0; i < nShapes; i++) {

    let x = shapes[k++] + shapes[k++];

    if (x < 0)

      x = wm1;

    else if (x > wm1)

      x = 0;

    shapes[k-2] = x;

    let y = shapes[k++] + shapes[k++];

    if (y < 0)

      y = hm1;

    else if (y > hm1)

      y = 0;

    shapes[k-2] = y;

    square(x, y, size);

  };

}

​