Hacker News new | ask | show | jobs
by zpr 2837 days ago
Did you use any server or client game or rendering framework? eg. Phaser, pixi or the like. And when you say the simulation is running on the client, do you mean it is client authoritative and the server just acts as relay? What sort of actions do you send?
1 comments

The only thing I'm using is Planck.js as the physics engine, besides that it's just raw canvas. I did spend quite a bit of time deciding whether I should go for WebGL or Canvas, but Canvas was just easier and it performs well enough.

There are actually 5 canvases stacked on top of each other - background, glows, objects, interface, cursor. The glows layer has a CSS blur property on it, which lets it be done on the GPU. Initially I just used the canvas shadowBlur everywhere but it was horribly slow, so this was one of the biggest performance boosts. The other layers are just there because they're invalidated/refreshed at different rates for performance reasons. The interface layer is particularly slow to update as its got to draw all the button icon paths, so it only ever rerenders the parts as they change, as opposed to some of the other layers which rerender every frame.