Pregunta ¿Es necesario $ (documento) si coloco todo mi JavaScript en la parte inferior de la página? [duplicar]


Posible duplicado:
jquery - ¿Es $ (documento) necesario? 

Poniendo el JS justo encima del </body> la etiqueta mejora el tiempo de carga percibido porque el navegador no tiene que leer y analizar a través de todos los JS antes de que pueda comenzar a renderizar la página.

Pero tiene otro beneficio, ¿no? No necesitamos envolver el JS en $(document).ready(function() { ... }) porque todos los elementos ya están por encima del JS y por lo tanto están listos para la manipulación.

  1. Es $(document).ready necesario para garantizar que el DOM se haya cargado por completo y esté listo para la manipulación?

  2. ¿Hay alguna diferencia entre los tiempos de ejecución? ¿Un método dispararía más rápido que el otro?

  3. Podríamos unir nuestros archivos JS externos (<script src="..." />) en la parte inferior de la página también, ¿o es necesario que esté en el encabezado?


32
2017-07-29 18:24


origen


Respuestas:


Esta respuesta SO dice NO:

pregunta de stackoveflow

$ (document) .ready es para asegurar que DOM completo está disponible en el momento en que se llama a la función. Cualquier función y evento que no dependa del DOM no necesita ser puesto en el evento listo.

Además, para mejorar la velocidad de representación de la página, cargue los archivos javascript dinámicamente de forma no bloqueante: http://berklee.github.com/nbl/ o https://github.com/rgrove/lazyload/

Esta técnica funciona de la siguiente manera:

 var script = document.createElement("script");
 script.type = "text/javascript";
 script.src = "file1.js";
 document.getElementsByTagName("head")[0].appendChild(script);

Este nuevo elemento carga el archivo fuente file1.js. El archivo comienza a descargarse tan pronto como el elemento se agrega a la página. Lo importante de esta técnica es que el archivo se descarga y se ejecuta sin bloquear otros procesos de página, independientemente de dónde se inicie la descarga. Incluso puede colocar este código en el encabezado de un documento sin afectar el resto de la página (aparte de la conexión HTTP que se utiliza para descargar el archivo).

este libro: "Alto rendimiento JavaScript" por Nickolas Zakas tiene mucha información interesante sobre la optimización del rendimiento de JavaScript.


19
2017-07-29 18:32