Html 5 Game Development Tools

Can anybody please guide me with the best engine for game development in HTML5? It is simple jumping and surface detection game. The theme is like jumping and go above the tree top

Solution 1:

I have spent a lot of time evaluating different options. Crafty is my favorite and the one I'm using for my current project. LimeJS is pretty good but it relies on the Closure framework, which I'm not a fan of. I also liked both EaselJS and CasualJS a lot.

btw one of the most "professional" options is Impact, so you should take a look at that one too. However it doesn't provide many of the features that the various open-source libraries do, and the features Impact provides that the other libraries don't aren't really that valuable. For example, if you need a physics engine for your game (and a platform game probably does) then you can easily integrate Box2D on your own. another Box2D link

That said, doing things from scratch without using a 3rd-party library is not a bad option. The free ebook Dive Into HTML5 does a great job of explaining how the Canvas element works. The thing is, there are a lot of graphics features that a good graphics library will provide that aren't built-in: a display heirarchy allowing Z-order and attaching objects to each other, animation through both tweening objects and spritesheets, mouse events so that you can click on objects, etc..

---

UPDATE: It's been over a year since I posted that answer and the situation has changed slightly (this is a nascent area of technology.) Although Crafty is still a great choice, in the past year EaselJS has picked up a lot of momentum (especially considering Adobe hopped on the EaselJS train.) I'm gonna switch to that tool for future projects (also note that it has a new website)

---

UPDATE 2: EaselJS is still my favorite option, but another great option has cropped up: Phaser. I'm planning to explore this one in the near future.

Solution 2:

It doesn't seem like there is a lot of need for a piece of middleware, the platform already takes care of most of the boring stuff, it won't really get easier by using further abstractions.

Solution 3:

I had some experience with gameQuery and made a side scrolling jump and avoid game for a company in the UK. I learnt a lot and had great fun doing it. The gameQuery engine provides basic sprite sheet animation (you are limited in sprite sheet layout), layers, a game loop and some basic collision detection (bounding box only). It targets the DOM and ties you into it heavily which may not be what you want. I gather other libraries allow you to switch implementation?

I agree with jhocking in that you should leverage as much pre-written stuff as you can. LimeJS comes with a javascipt implementation of Box2d, the engine that was used to make Angry Birds. I can't really comment on Google Closure but if its good enough for Google its good enough for me.

Solution 4:

You might want to check out CopperCube. It's an IDE for 3D HTML5 and Flash development. Commercial, but not too expensive. Focused on 3D, so makes heavy use of WebGL CopperCube - a 3D editor for WebGL and Flash, Mac OS X, Windows and mobile apps