P5js [Violation] 'requestAnimationFrame' handler took 75ms

I am getting this ‘requestAnimationFrame’ error with this code. I guess there’s something with the for loop that causes the problem but I can’t figure an alternative way of getting the same visual result. Any idea?

let zoff = 0;

function setup() {
  createCanvas(windowWidth, windowHeight);
  background(0);
}

function draw() {
  background(0);
  translate(width / 2, height / 2);
  scale(40);
  noStroke();
  fill(255);

  for (let a = 0; a < 7; a += 0.0012) {
    
    let x = cos(zoff) * 20 * sin(a);

    let y = cos(zoff+x/2) * 10 * cos(a);

    let e = cos(x) / sin(y) + zoff;

    circle(sin(e) * y, cos(e) * y, 0.091);
    
  }

  zoff += map(mouseX, 0, width, -0.03, +0.03);
}```

I’m not able to replicate your error. When I run it, I don’t get “requestAnimationFrame” messages in the web editor console or in the browser javascript console.

What is the exact message you are getting?

It might be a performance warning – the browser or computer not being able to step 7/.0012 = 5833 times each frame without falling behind your framerate, for example…

1 Like