We have been experimenting with using p5js’s draw function as one giant listener for normal html created dom elements, mostly range sliders that then manipulate p5js.sound objects.
Obviously this is not “the right way” someone would do this, a normal “correct” approach would be to assign listeners to the elements. This is both cleaner, more logical and more efficient (why check in the draw loops all these values that probably did not change).
On the other hand, this has some great advantages as well.
- First of all, it is very quick to code this way (i know, bad excuse here) where all you have to do is have one js line in the draw method that checks the slider value.
- The code is much shorter, since there are no functions defined for each control.
- Code is much easier to manipulate, just change what’s going on inside the draw.
The question here is this - how much of a performance impact if at all does doing it this way have? our synth has around 50 sliders and even so it seems like the performance is terrific, with a draw method of around 1000 lines of code. Also, are there any other disadvantages I should think about? Is this genius or is this dumb?
P.S. - using a framerate of 25fps for the draw method.