Buffered Draw to improve performance

I notice that p5.js gets overloaded quickly when it gets a lot of work and screen updates to do on every draw cycle. My system temperature goes up and I hear the fan spinning at max speed. It happens a lot!

So, I’m wondering is there a way to buffer screen I/O? Delphi has functions called beginUpdate … endUpdate. You wrap these around list processing and it does an amazing job at speeding up the writing of lists to screen.

Does p5.js have such a thing?

In p5, I do see beginContour and beginShape but these are specific to vertex. I think it would be very useful to have a general beginUpdate block.

1 Like

Hello, and welcome to the forum! :partying_face:

You can use createGraphics to get and off-screen graphics buffer. There’s also tips n tricks around optimizing for performance in this article.

If you share your code with us, chances are that you will get some pointers as well.


Thanks for the optimize link.
I’m experimenting with Genetic Algorithms and the function distSquared() is a much better idea for fitness.

I have been trying createGraphics and it does seem to be a good solution. I treat it like an off screen bitmap.

1 Like