Tengo algo de confusión con respecto al nuevo atributo asíncrono al elemento de script en HTML5 al que espero que alguien pueda dar una respuesta clara.

Los navegadores son capaces de conexiones paralelas, por lo que las imágenes se descargarán en paralelo. Pero cualquier javascript externo no se descarga en paralelo con otro javascript externo e imágenes. Los scripts bloquean la carga de la página hasta que se hayan descargado y ejecutado.

Para descargar un script sin bloquear el resto de la carga de la página, la técnica más común es crear un elemento de script, como hace el fragmento de código de Google Analytics:

var ga = document.createElement('script');
ga.type = 'text/javascript';
ga.src = '...ga.js';
ga.async = true;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);

Tampoco estoy seguro de cómo funciona exactamente eso.

el navegador analiza y muestra la página, luego, una vez que ha finalizado, se da cuenta de que el DOM ha cambiado, lo que da como resultado que el script ga.js se descargue y se ejecute

o

el navegador comienza a descargar el javascript en paralelo con otros recursos.

Creo que es el último.

El nuevo fragmento asíncrono de Google Analytics incluye el atributo asíncrono HTML5 en el elemento de script que crea. Eso no ayudará al problema de bloqueo de la página, que ya se resolvió con la técnica "Elemento DOM de script". Entonces, ¿qué agrega async a la imagen? Según w3schools, "si está presente async, el script se ejecuta de forma asíncrona con el resto de la página (el script se ejecutará mientras la página continúa el análisis)".

Y de acuerdo con el sitio de Steve Souders, "el principal beneficio de este [atributo asíncrono] es que le dice al navegador que las secuencias de comandos subsiguientes se pueden ejecutar inmediatamente, no tienen que esperar por ga.js".

Entonces, ¿async y la técnica del elemento Script DOM están resolviendo el mismo problema?