Estou desenvolvendo um jogo usando JavaScript ecanvas. À medida que o jogo é carregado, todas as imagens que serão usadas estão sendo armazenadas em cache.

Observando a linha do tempo do recurso, vejo que o código a seguir aciona uma solicitação assíncrona:

var sprite = new Image();
sprite.src = "sprites/sheet1.png";

O mecanismo continuará executando, eventualmente começando a desenhar e jogar o nível. As imagens carregadas após o primeiro quadro ser pintado podem nunca aparecer devido ao recorte (por exemplo, não ficando "sujo").

Então testei o seguinte:

console.log("begin");
var sprite = new Image();
sprite.onload = function() { console.log('loaded!'); };
sprite.src = "sprites/sheet1.png";
console.log("end");

As saídas do console resultantes na ordem em que ocorrem são:

Estou procurando uma maneira semelhante a$.ajax comasync: false para executar o carregamento. Não consigo descobrir como ... obrigado antecipadamente por sua ajuda! J.