Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HTML5 canvas game performance vs. alternatives [closed]

I am starting development on a HTML5 game using the canvas. Things are going alright so far, but I have some things I am a little puzzled on, mostly having to do with performance of such game. So instead of me running into a bunch of problem deep down the development process, I would be grateful to find out now.

I have before worked in languages such as OpenGL and learned how important it is to render things in an efficient order, this is something that can give a factor of hundreds better performance than just randomly drawing stuff to the screen switching back and forth between textures/shaders etc. Is this something I should keep in mind with a canvas game, or will things automatically be queued up and rendered in an efficient order?

It is going to be a 2D game, but with quite a few objects on the screen, and most of them dynamically desaturated and changed in brightness (filters). Is performance going to be a serious problem?

What are the alternatives, any javascript game-engine that can help performance? Am I going to get a performance boost by switching to WebGL even though standard canvas has hardware-acceleration?

like image 886
Jacob Kofoed Avatar asked Apr 25 '14 15:04

Jacob Kofoed


1 Answers

Yes, you'll get a big performance boost with WebGL. Consider using the excellent 2D rendering system called Pixi. It renders sprites to WebGL with a fallback to Canvas.

Or, you can make your own low-level WebGL sprite rendering system using game-shell and gl-modules. gl-now is a good entry point into these modules. You can use them to build your own game engine.

Phaser, is an complete HTML5 game engine that currently has a lot of traction, and uses Pixi under the hood for rendering. A better place than Stackoverflow to look for help about all these issues is http://www.html5gamedevs.com.

like image 177
d13 Avatar answered Sep 28 '22 20:09

d13