javascript - Best way to make sure content is ready to serve in a time limited environment? -

i developing html/javascript game requires use of images. user has amount of time answer question. asking best way download , cache files , make sure ready? appcache looking for?

you need delay execution of game loop until required assets loaded. code modular enough allow this.

the browser fires event when resource located @ src of image element has been downloaded. using event, can create basic preloading solution:

var img = new image();  img.onload = function() {                                  console.log('image loaded!'); };  img.src = '/images/my-image.jpg'; 

expand solution iterate on assets. once they're loaded, call code begins game loop.

there number of prebuilt solutions available:

• http://www.createjs.com/#!/preloadjs
• http://thinkpixellab.com/pxloader/
• https://github.com/nandastone/precook-backbone