Optimizing code for better performance (e.g. when iterating through multiple objects)

This suggestion is inspired by a forum-post in the Kadenze Nature of Code course titled 'PERFORMANCE VERY SLOW WITH 100 FLOCKING BOIDS - OPTIMIZATION SUGGESTIONS?' (in the 'general' category)
I think a general tutorial with some 'best practice' examples would be really helpful. It should cover things like tools for monitoring performance & typical 'things to avoid' (with preferred alternatives demonstrated). Maybe something about browsers too (I guess all browsers are not equal). It could take the form of a particular project (e.g. boids), showing first an example with low-performance code, slowing down & running syrupy as nr. of objects increases, demonstrating how gradual performance-gains can be achieved as the code is improved according to 'best practice'. Maybe touching on the key differences between p5.js & processing in their current form.

Start with the referenced forum post about slow performance with 100 flocking boids and define the tutorial scope around a boids project. Research browser performance-monitoring tools, common iteration optimizations, and differences between p5.js and Processing. Done should be a complete best-practices tutorial showing measurable improvements from a slow example.

Written by the indexing model from the issue text.