Indie game storeFree gamesFun gamesHorror games
Game developmentAssetsComics
SalesBundles
Jobs
Tags

Sorry for the late reply and thank you for the amazing tips!
Your guess is correct. I'm using different images on different backgrounds/divs. Every scene/lvl in my prototype is represented by a single div, and there is a special pattern, that I have created, that decides what objects to show or remove on the current scene.

The pre-rendering technique called Blitting that you mentioned seems to be very useful in general and maybe just what I need. But i didn't quite get that "baking" method so I'm gonna need to read more about it.

I wish I knew where I could find all of those hidden techniques that make a huge difference in the outcome, instead of learning them with time. (T __ T)

(+1)

A few good spots for general html5 learning resources are html5rocks html5gamedevs and developer.mozilla.org.  Also w3schools is a great html/javascript reference resource.

To generate a base64 string from your image you can use an online "base64 image encoder".
Then to bake the string into css you'll use a data url like this:

div#backgroundDivId { background: no-repeat url("data:image/png;base64, ...."); }

That way the css and images would get loaded as one before the game starts.  


And take heart, as you work on and release projects, you'll only get better and better.