Ventajas de cargar JS en la parte inferior en oposición a la parte superior del documento

Question

¿Cuáles son los beneficios reales (si corresponde) para cargar su JS en la parte inferior del documento, en lugar de la parte superior. Parece que hay un breve retraso en la carga de la página y la funcionalidad dependiente de JS.

Estoy usando html5boilerplate para comenzar todas mis plantillas, pero no estoy muy seguro de cuán beneficioso es cargar el JS en la parte inferior.

¿Realmente hace una gran diferencia, y si es así, por qué?

Answer 1

1. Si incluye archivos JS externos en la parte inferior de la página, usted da la prioridad de sus peticiones HTTP a la pantalla visual que serán presentados al cliente en lugar de a la lógica de interacción o dinámica. Creo que si no usas una red de entrega de contenido para entregar imágenes al cliente, entonces solo puedes procesar un máximo de 2 solicitudes HTTP a la vez. No quiere perder estas solicitudes en lógica porque todos sabemos cuán impaciente es el usuario final.

2. Al cargar js en el final del archivo, puede acceder al DOM (la mayoría de las veces) sin tener que llamar a la función document.ready(). Usted sabe que si el procesamiento de la página finalmente llega a su código de JavaScript, los elementos de página necesarios ya se han cargado.

Hay algunas razones más por ahí, pero estos son los más importantes que trato de recordar cuando se siente tan incómodo para colocar todos los js en la parte inferior.

Answer 2

según lo que está en el js. si solo quiere que 'vaya' cuando la página se carga rodee su código por jquery's: $(function(){}) o colóquelo en la parte inferior de la página

Answer 3

Una búsqueda en Google arrojará una gran cantidad de resultados sobre por qué quiere hacer Entonces, ¿qué mejora verá? Echa un vistazo a algunos de estos enlaces siguientes:

• High Performance Web Sites: Rule 6 - Move Scripts to the Bottom
• Rails Best Practices: Scripts at Bottom

Básicamente, la razón principal para ello es que se va a mejorar los tiempos de su página de render. Desde el primer artículo:

[I] t es mejor mover las secuencias de comandos desde la parte superior a la más baja posible en la página. Una razón es habilitar la representación progresiva , pero otra es lograr mayor paralelización de descarga.

Answer 4

Como los scripts a los que se hace referencia se están descargando, los navegadores normalmente no descargarán otros archivos en paralelo, lo que ralentizará la carga de la página.

se refieren: Best Practices for Speeding Up Your Web Site