Hacker News new | past | comments | ask | show | jobs | submit login

https://jsfiddle.net/vas71r68/3/

Don't do stuff like pushing rectangles to an array to have their position wrapped, instead of simply doing it right there, unless you want to test the GC.




My point was more to compare libraries than to create the best canvas performance. But you are right: simple plain canvas is usually pretty fast.


Yeah, by default it's accelerated anyway, at least if depending on browser and hardware. So, at least for something as basic as drawing a lot of things with the same color, engines and additional code can only make it slower.

Generally speaking, avoid GC, and avoid setting state that's already set... if you do these two things and use engines that do these two things, it's usually going to be more than fast enough :)


Its nice if you can avoid creating new objects, but in recent optimization I've seen no difference between reusing objects vs immutable objects. Removing unnecessary code is always nice though.


What might be more interesting is drawing performance of images. And yes, a comparison with plain old canvas would be nice too.


LOL this looks like 60 FPS for 5000 rectangles and _no_ canvas engine .. stock. The three of the article are 10-20 FPS. (Pixelbook c0a)

Correct me if I am wrong.

Nice optimization.




Consider applying for YC's Spring batch! Applications are open till Feb 11.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: