2012-08-25 21 views
12

Estoy evaluando los recursos existentes para la optimización de carga de scripts, pero lo he leído en algunos artículos como this, hace referencia a que los navegadores anteriores bloquean otras descargas hasta que se complete esta fase de carga de scripts secuenciales. Compruebo Modernizr (yepnope.js), headjs y ControlJs como candidatos. Pero, ¿es necesario utilizar estas herramientas para la carga de scripts paralelos en los navegadores modernos?¿Los navegadores modernos están cargando scripts en paralelo o secuencialmente?

+0

secuencialmente, si no haciendo algo extra para cargar archivos JavaScript ... –

+0

Enlazando https://stackoverflow.com/q/1795438/6 32951 – Pacerier

Respuesta

17

creo que por defecto la mayoría de los navegadores de hoy en realidad cargar los scripts en paralelo; pero el navegador no ejecutará los scripts por defecto en paralelo. Por ejemplo, en el siguiente código, los scripts se cargarán en paralelo. En la imagen, podemos ver que Fast1.js y Fast2.js cargan extremadamente rápido, pero según el tiempo en la consola del navegador, Fast2.js ejecuta 3 segundos después de que Fast1.js se ejecuta.

Además, algo más a tener en cuenta es que el orden de los archivos puede hacer la diferencia. El archivo Backbone.js depende del archivo underscore.js. Si cambiamos el orden de estos archivos, donde bacbone.js está antes de underscore.js, se generará un error.

<html > 
<head> 
    <title></title> 
    <script src="scripts/fast1.js" type="text/javascript"></script> 
    <script src="scripts/libs/jquery-1.8.3.js" type="text/javascript"></script> 
    <script src="scripts/libs/underscore.js" type="text/javascript"></script> 
    <script src="scripts/libs/backbone.js" type="text/javascript"></script> 
    <script src="scripts/fast2.js" type="text/javascript"></script> 
</head> 
<body> 
    Hello 
    <script type="text/javascript"> 
     console.log("html: " + Date()); 
    </script> 
    <img src="imgs/bImg.png" /> 
</body> 
</html> 

Aquí está el código para el archivo JavaScript Fast1.js y Fast2.js

console.log("Fast 1: " + Date()) 

Script file loading in browser

para el script de carga utilizo Require.js. También proporciona la ventaja de organizar su código en módulos que están en archivos individuales.

Aquí hay un puesto de un blog se crea en Script Browser Carga: Browser Script Loading

Éstos son algunos artículos sobre la escritura de carga:

+0

¿Existe un estándar HTML que prohíbe al navegador ejecutar el código descargado de forma paralela? – Pacerier

1

La mayoría de los navegadores los cargan secuencialmente. Sin embargo, existe el atributo async que puede poner en una etiqueta script para provocar que se cargue de manera diferente.

MDN explica lo que hace una etiqueta script muy bien.

https://developer.mozilla.org/en-US/docs/HTML/Element/Script

Cuestiones relacionadas