performance of p5*js when using `color` and `set`

nlooije

Hello,

I'm writing a fluid physics simulation in Javascript and want to draw the resulting profiles using p5.js. Unfortunately, the postprocessing using p5.js turns out to be the bottleneck rather than the simulation itself.

The simulation is run inside the p.draw function which calls domain.collide, domain.periodic and domain.stream every frame. The calculated values are the converted to a color using p.color, every pixel set to this color using p.set and finally all pixels are updated using p.pixelUpdate().

I have run the Chrome profiler and found that d.color takes up 45% of the CPU time whereas my simulation only accounts for 14%+4%=18% of the CPU time. Someother p5.js functions are also taking significant CPU time which could be better spent on the simulation:

Does anyone have any advice on how to limit the CPU time needed by p5.js? Is perhaps setting the color directly through p.pixels a much better way?