HTML5 - Does it have the power to handle a large 2D game with a huge world? [closed]

Question

I have been using XNA game studio, but due to private reasons (as well as the ability to publish anywhere & my heavy interest in isogenic engine), I would like to switch to HTML5.

However, I have very high 2D graphic demands for my game.

The game itself will have a HDD size of anywhere between 6GB (min) to 12GB (max) which would be a full game deployed offline. The size of the images aren't significantly large, so streaming would be entirely possible if only those assets required were streamed as needed. The game has a massive file size because of the sheer amount of content.

For some images or spritesheets, they would be quite massive. (ex. a very large Dragon, which if animated in a spritesheet would be split into two 4096x4096 sheets or one 8192x8192 sheet). Most assets would be very small, and about 7MB for a full character with 15 animations in every direction (all animations not required immediately) so in the size of a few hundred KB to download before the game loads.

My question, however, is if the graphical power of HTML5 is enough to animate several characters on screen at once, when it flips through frames quite rapidly. All my sprites have about 25 frames per animation, 5 directions (a spritesheet for each direction & animation), and run at 30fps. Upon changing direction, animation, or a new character entering, spritesheets would change and be constantly loading/unloading. If I pack all directions in a single sheet, it would be about 2048x2048 per sheet.

Most frameworks have no problem with this, but I am afraid from what I read that HTML5's graphical capabilities will limit me. Since it takes significant time simply to animate characters in any language, I'd like a quick answer.

Answer 1

It really is debatable on a few things, for the most part browsers now support hardware, so to some degree your hardware will allow more performance, no chance it'll really perform well on devices/phones as a canvas game, they would be better off as an app than something in a webpage.

It is possible to run a good sized canvas game in isometric how ever. But you will get varying performances on different browsers.

Some main factors:

Browser compatibility of canvas features. How you code the game (the biggest factor of them all) Compression of images... How many images on a screen at any given time (because you have to loop through them) How many loops, and how large the loops are will always add to the time.

Also NEVER draw what you cannot see off canvas.. its a waste.

Some useful links:

Test which approach will give better performance in javascript using:

http://jsperf.com/

Use request animation frame when ever possible for animation, this means animation won't run unless the user is viewing the window (no point doing animation if the user is not looking)

Also check this website for performance tips/results:

http://www.html5rocks.com/en/tutorials/speed/html5/

Other than this theres little else to really be sure because little info is given on the game, theres more to it than graphics (such as path finders, how much maths, hit detection and weather its live action for multiple players...which brings in server performance for sockets).

p.s 6GB for a game in graphics alone???? I think your game might be too big ! For fun:

http://yourgameideaistoobig.com/

Answer 2

You could definitely get any game to work using any framework, engine, or language. The question isn't "Can you?", the question is "Should you?"

HTML5 would require quite a lot of solutions to problems that other languages would not have. Until HTML5 gets more powerful, I'd say "No, it is not" to your question. However, don't be surprised that it will be powerful enough very soon.