Estaba usando el plugin "Yslow" para Mozilla Firefox, y me dijo que debería poner JavaScript en la parte inferior. He escuchado esto antes, pero realmente no lo he pensado demasiado. ¿Existe realmente una ventaja al colocar JavaScript en la parte inferior de una página web en comparación con la parte superior?JavaScript en la parte inferior/superior de la página web?
Respuesta
Permitirá que la página web se cargue visiblemente antes de ejecutar JavaScript, lo que tiene sentido para cosas como Google Analytics, que no es necesario que suceda antes de que la página se cargue.
Es posible que también desee buscar elementos como jQuery, prototipo, etc. y adjuntarlo al controlador "listo", que ejecuta el código JavaScript después de que DOM se haya cargado por completo, que es un lugar apropiado para muchos códigos JavaScript.
¿Esto significa que JavaScript que normalmente está dentro de las etiquetas
puede estar en cualquier lugar de la página después de la etiqueta ? – userSí, la etiqueta
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.
Suponiendo que no está ejecutando en un CDN o no está prestando servicio a su JS desde un subdominio o servidor independiente, se cargará de forma síncrona y forzará su contenido HTML a esperar hasta que haya descargado los archivos. Al colocar el JS en la parte inferior de la 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.
Si tiene contenido html estático y una gran cantidad de javascript, puede hacer una diferencia en el tiempo de carga de la página percibida, ya que el html se cargará primero y le dará al usuario algo para mirar. Si no tienes mucho javascript, o el contenido de la página existente depende de que el javascript sea útil, entonces esto no es tan útil prácticamente hablando.
Quiero traer la actualización a este tema, Google ha introducido recientemente async recortado http://support.google.com/analytics/bin/answer.py?hl=en&answer=1008080&rd=1 que se puede agregar para que su sitio traiga, p. soporte de estadísticas de google. Se debe colocar en la parte inferior de la sección <head>
para obtener el mejor rendimiento. El punto es que esto aumenta probablemente la capucha 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 las herramientas de google webmaster 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. Utilicé comillas porque no cuento la página completamente cargada hasta que javascript termine ;-)
Permite que todos los elementos DOM se carguen completamente antes de cargar el Javascript que los aborda. Este estándar también es parte de Visual Studio.
Colocar los scripts en la parte inferior del elemento mejora la velocidad de visualización, porque la compilación de scripts ralentiza la visualización.
- 1. JavaScript en la parte inferior de la página?
- 2. Javascript: comprobar SI la página está en la parte superior
- 3. actualizar una parte de la página web en php
- 4. Mostrar una parte de la página web en la vista web android
- 5. Editar bloques de JavaScript de la página web ... en vivo
- 6. ¿Hay un complemento de JQuery que superpone sugerencias en la parte superior de la página web?
- 7. Javascript zoom de la página
- 8. ¿document.body.innerHTML = "" borra la página web?
- 9. parte Quitar de la cadena en Javascript
- 10. zoom en la página web
- 11. Cómo pegar texto en la parte inferior de la página?
- 12. Extracción título de la página y la fecha cuando se imprime la página web (con CSS?)
- 13. CSS: delgada pancarta en la parte superior de la página (como la naranja en esta página)
- 14. Usar CMYK en la página web
- 15. acceso Javascript otra página web
- 16. Imprimir pie de página en la parte inferior de la página en safari
- 17. Ancho y alto de la parte web de SharePoint dinámico
- 18. malicioso código javascript en mi página web
- 19. Haciendo que la imagen del pie de página se adhiera a la parte inferior del navegador web o página
- 20. Cómo alinear div en la parte inferior de la página, no en la parte inferior de la pantalla
- 21. Añadir contenido a la parte inferior de la última página
- 22. CSS Push Div a la parte inferior de la página
- 23. jquery remove() salta a la parte superior de la página
- 24. ¿Usa HTML5 Canvas para capturar parte de una página web?
- 25. jQuery Desplazarse a la parte inferior de la página
- 26. Desplácese hasta la parte superior de la página
- 27. Css alinear a la parte inferior de la página
- 28. Dibujo en la parte superior de una imagen en Javascript
- 29. JQuery desplazarse hasta la parte superior de la página
- 30. JavaScript/jQuery: reemplazar parte de la cadena?
Puede ir directamente a la fuente en este ... http: //developer.yahoo.com/performance/rules.html es la explicación de Yahoo de esta práctica. –
¿Qué tal si el Javascript está en un archivo separado? Prefiero esta forma, simplemente porque es más fácil de depurar/leer. ¿Es esto cargar más rápido/más lento? –
¿Estas reglas de rendimiento de Yahoo todavía están actualizadas? Tengo que imaginarme que alguien ha publicado un conjunto de reglas similarmente completo (o posiblemente Yahoo haya publicado una actualización) que tenga en cuenta los cambios que se han producido en los últimos cuatro años. – kralco626