¿Cuáles son los beneficios reales (si los hay) de cargar su JS en la parte inferior del documento, a diferencia 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 realmente seguro de cuán beneficioso es cargar el JS en la parte inferior.
¿Realmente hace tanta diferencia, y si es así, por qué?
Si incluye archivos js externos en la parte inferior de su página, le da prioridad a sus solicitudes HTTP a la visualización que se presentará al cliente en lugar de a la lógica de interacción o dinámica. Creo que si no usa una red de entrega de contenido para entregar imágenes al cliente, solo puede procesar un máximo de 2 solicitudes HTTP a la vez. No desea desperdiciar estas solicitudes en la lógica porque todos sabemos lo impaciente que es el usuario final.
Al cargar js al 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 la representación de la página finalmente llega a su código javascript, los elementos necesarios de la página generalmente ya se han cargado.
Hay algunas razones más, pero estas son las importantes que trato de recordar cuando se siente tan incómodo colocar todos los js en la parte inferior.
A medida que se descargan los scripts a los que se hace referencia, los navegadores normalmente no descargan otros archivos en paralelo, lo que ralentiza la carga de la página.
Una búsqueda en Google arrojará una gran cantidad de resultados sobre por qué desea hacerlo y qué mejora verá. Echa un vistazo a algunos de estos enlaces siguientes:
Básicamente, la razón principal para hacerlo es que mejorará los tiempos de renderizado de su página. Del primer artículo:
[I]s mejor mover las secuencias de comandos desde la parte superior a la parte inferior de la página como sea posible. Una razón es habilitar el renderizado progresivo, pero otra es lograr una mayor paralelización de descarga.