Hello happy coders!
I found this particle code on another post and updated it make it work for my purpose... see codepen. Every time you mouse-over the black area, 300 particles (divs) are added and animated. While it looks pretty smooth in Safari & Firefox - it's not smooth at all in Chrome. And I know the processor load is pretty high in all browsers.
How can I improve the code to make it run more smoothly with less processor load? Maybe using canvas might be a bett
Canvas Context
I like to think of working with the canvas as telling a robot how to draw something, and this is done primarily through the canvas context. The context is also where you set all the styling like fill style, stroke style, line width, alpha, shadow, font, transforms, filters, blend modes, etc. Think of it kind of like the current CSS style.
Here's a list of all the properties and methods available on the context.
https://developer.mozilla.org/en-US/docs/