Noise2D example runs at 1.7 seconds per frame

[takyano]

Actual Behaviour

The Noise 2D example is extremely slow in Chrome on Windows. Firefox and Edge are worse. I get 1.5-1.7 Seconds per frame. 2 seconds per frame on the web editor.

Is this an issue for viewers on other platforms?

Some other issues with the example:

• The second label states that it's 1 octave with a 0.7 falloff. The arguments in the code are 5 octaves and 0.5 falloff
• There is a trailing asterisk at the end of the example description.

Expected Behaviour

The Noise 2D example should run at a frame rate that doesn't leave it as a slide show and makes the mouse movement code look like its working.

The second label should match the actual called parameters.

Steps to reproduce it

Add: text( 1 / frameRate() , 20, 20 ); after the parameter labels at the bottom of draw()

Screenshots of the issue

Would you like to work on the issue?

This is a good starting example. It shows how someone starting out with p5.js would write a routine to display Noise using 2 for loops and drawing with point().

I think Noise 2D should be a static example that shows what effect the parameters have on the noise generated and another example should be created that shows the use of loadPixels, updatePixels and the pixels array with the mouse movement code.

Or just update the example to use the pixels array.

I have made an example that uses the pixels array and the frame rates are much better at 11 FPS.

Noise2D Example Modified (8-10 FPS)

I would like to work on this.

References

PR for the Noise Examples: change the noicd2d example.

Daniel Shiffman's Coding Train Example: I.5: 2D Noise - Perlin Noise and p5.js Tutorial

[limzykenneth]

Sounds good to me, you can file a PR if you like. One thing that I would change in the example you provided is the function namings, specifically updatePixel is probably too close to updatePixels and might cause confusion. We'll working any other tweaks necessary in the PR.