Hacker News new | ask | show | jobs
by TazeTSchnitzel 3396 days ago
JavaScript, probably.

More serious answer: it's using HTML5 canvas, which is quite inefficient as rendering APIs go. For example, if you use n colours when rendering a frame, and your game runs at m frames per second, you are invoking the browser's CSS parser n×m times a second, because CSS colour strings are the only way to express colours, and it is an exclusively immediate-mode API.

The engine in use might be layering on top additional inefficiencies.

(I love how easy to use HTML5 canvas is, but its CPU usage, performance and power consumption properties make me want to cry.)

2 comments

That's only if you switch colors frequently. Canvas can be quite efficient.

It's irrelevant here-- the game is using Phaser, which can render as either Canvas or WebGL (WebGL in my case), but it's spending most of it's time in engine code updating expensive transforms every frame.

Ah, I see. I did check the source to see if it was using canvas 2D, but I failed to check if it wasn't using WebGL.
If you're willing to forgo the built-in drawing primitives, you can get access to the underlying buffer and draw directly to that. That way you avoid the CSS parser.

Edit: in particular, getImageData and putImageData.

Yep, but then you forego hardware acceleration, so this is only reasonable at low resolutions.

If you want to do anything serious, WebGL's your only option.