[p5.js 2.0 Bug Report]: noise() is laggier in 2.x

[mngyuan]

Most appropriate sub-area of p5.js?

• Accessibility
• Color
• Core/Environment/Rendering
• Data
• DOM
• Events
• Image
• IO
• Math
• Typography
• Utilities
• WebGL
• Build process
• Unit testing
• Internationalization
• Friendly errors
• Other (specify if possible)

p5.js version

2.1.1

Web browser and version

Zen 1.17.7b

Operating system

MacOSX 15.6.1

Steps to reproduce this

Steps:

1. Open this sketch https://editor.p5js.org/mngyuan/sketches/oTOMucuCM
2. Change library version to p5 2.x
3. Run the sketch

Snippet:

function setup() {
  createCanvas(300, 600);
}

function draw() {
  // let's save frameCount into a time variable t, and scale it slower for
  // smoother motion
  let t = frameCount * 0.005;
  
  background(220);
  noStroke();
  // let's iterate over the canvas but for speed we'll jump by 3 instead of
  // by one
  for (let i = 0; i < width; i += 3) {
    for (let j = 0; j < height; j += 3) {
      // use noise to color this "pixel", and use t to change over time
      let n = noise(i * 0.005 + t, j * 0.005, t);
      fill(n * 255);
      // draw the "pixel"
      rect(i, j, 3);
    }
  }
}

Expected Behavior

Same framerate as p5.js 1.x

Actual Behavior

p5.js 2.x displays noticeable jittery-ness and lag when rendering this sketch

Notes

I use this sketch to introduce noise and the concept of perlin noise to my students, but I just noticed it seems to be laggier (tested in both Safari and Firefox/Zen on macOS) when using p5.js 2.

[Vikas4245]

I would like to work on this issue please assign this to me .