Async scripts for asm.js

Você está lendo a versão em inglês deste conteúdo porque ainda não há uma tradução para este idioma. Ajude-nos a traduzir este artigo!

Every medium or large game should compile asm.js code as part of an async script to give the browser the maximum flexibility to optimize the compilation process. In Gecko, async compilation allows the JavaScript engine to compile the asm.js off the main thread when the game is loading and cache the generated machine code so that the game doesn't need to be compiled on subsequent loads (starting in Firefox 28). To see the difference, toggle javascript.options.parallel_parsing in about:config.

Colocando async em ação

Efetuar a compilação da async é fácil: ao escrever seu JavaScript basta usar o atributo async como no exemplo abaixo:

<script async src="file.js"></script>

ou faça a mesma coisa via script:

var script = document.createElement('script');
script.src = "file.js";
document.body.appendChild(script);

(Scripts criados a partir de scripts padrão da async.) The default HTML shell Emscripten generates produces the latter.

When is async not async?

Two common situations in which a script is *not* async (as defined by the HTML spec) are:

<script async>code</script>

and

var script = document.createElement('script');
script.innerHTML = "code";
document.body.appendChild(script);

Both are counted as 'inline' scripts and get compiled and then run immediately.

What if your code is in a JS string? Instead of using eval or innerHTML, both of which trigger synchronous compilation, you should use a Blob with an object URL:

var blob = new Blob([codeString]);
var script = document.createElement('script');
var url = URL.createObjectURL(blob);
script.onload = script.onerror = function() { URL.revokeObjectURL(url); };
script.src = url;
document.body.appendChild(script);

The setting of src rather than innerHTML is what makes this script async.