JavaScript en la parte inferior / superior de la página web?
Estaba usando el plugin "Yslow" para Mozilla Firefox, y me dijo que debería poner JavaScript en la parte inferior. He oído esto antes, pero realmente no he pensado demasiado en ello. ¿Hay realmente una ventaja en poner JavaScript en la parte inferior de una página web en comparación con la parte superior?
8 answers
Permitirá que la página web se cargue visiblemente antes de ejecutar JavaScript, lo que tiene sentido para cosas como Google Analytics, que no tienen que suceder antes de que se cargue la página.
Es posible que también desee buscar en cosas como jQuery, prototype, etc. y adjuntarlo al controlador "ready", que ejecuta código JavaScript después de que el DOM se haya cargado completamente, que es un lugar apropiado para mucho código JavaScript.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-10-28 17:12:31
Suponiendo que no se está ejecutando en una CDN o no está sirviendo su JS desde un subdominio o servidor separado, se cargará de forma sincrónica y obligará a su contenido HTML a esperar hasta que haya descargado los archivos. Al colocar el JS en la parte inferior de su página antes de la etiqueta de cierre </body>, está permitiendo que el HTML se analice antes de cargar el javascript. Esto da el efecto de tiempos de carga de página más rápidos.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-10-25 14:46:22
Si tiene contenido html estático y mucho javascript, puede hacer una diferencia en el tiempo de carga percibido de la página, ya que el html se cargará primero dando al usuario algo que mirar. Si no tiene mucho javascript, o el contenido de la página existente se basa en el javascript para ser útil, entonces esto no es tan útil en términos prácticos.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-10-28 17:13:25
Quiero actualizar este tema, Google ha introducido recientemente async snipped http://support.google.com/analytics/bin/answer.py?hl=en&answer=1008080&rd=1 que se puede agregar para su sitio para traer, por ejemplo, soporte de estadísticas de Google. Debe colocarse en la parte inferior de la sección <head> para obtener el mejor rendimiento. El punto es que esto aumenta la capucha probable de la baliza de seguimiento que se enviará antes de que el usuario abandone la página.
También debe estar ubicado allí si desea verificar su sitio en Google webmaster tools utilizando su google Analytics.
Aparte de eso, las mismas reglas todavía se aplican básicamente: javascript en la parte inferior para la carga "rápida" de la página. Usé comillas porque no cuento la página completamente cargada hasta que termine javascript; -)
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-08-21 18:43:36
Sí, la página cargará el contenido y lo renderizará antes de cargar y ejecutar javascript, y la página, como resultado, se cargará más rápido.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-10-28 17:10:40
Permite que todos los elementos DOM se carguen completamente antes de cargar el Javascript que los aborda. Este estándar también forma parte de Visual Studio.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-04-18 18:00:56
Colocar scripts en la parte inferior del elemento mejora la velocidad de visualización, porque la compilación de scripts ralentiza la visualización.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-06-08 12:14:55
TOP
Cuando coloca su JavaScript en la parte superior de la página, el navegador comenzará a cargar sus archivos JS antes del marcado, las imágenes y el texto. Y dado que los navegadores cargan JavaScript de forma sincrónica, nada más se cargará mientras se carga el JavaScript. Así que habrá un marco de tiempo de unos segundos donde el usuario verá una página en blanco, mientras que el JavaScript se está cargando.
ABAJO
Por otro lado, si coloca su JavaScript en la parte inferior de la página, el usuario verá la carga de la página primero, y después de eso el JavaScript se cargará en segundo plano. Así que si, por ejemplo, su CSS y HTML tarda 5 segundos en cargarse, y su JavaScript tarda otros 5 segundos, poner nuestro JavaScript en la parte superior de la página le dará al usuario un tiempo de carga "percibido" de 10 segundos, y ponerlo en la parte inferior le dará un tiempo de carga "percibido" de 5 segundos.
Tomado de Demian Labs.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-09-10 19:45:19