Async y documento listo

Question

Intento optimizar mis páginas poniendo algunos atributos async en mis scripts. Parece romper mi javascript ya que $(document).ready se ejecuta antes de que se carguen todos los scripts.

Vi que puedo resolver mi problema poniendo $(window).load en lugar de $(document).ready pero me preguntaba si hay una solución mejor. Este disparador solución de 2 problemas en mi caso:

1. que tienen que cambiar todo $(document).ready y decirle a todos los desarrolladores de no usarlo nunca más
2. Los scripts se ejecutarán después de que todas las imágenes se cargan. Mi sitio web tiene muchas imágenes pesadas y realmente necesito algunos scripts para ejecutarlos lo antes posible después de que dom esté listo.

¿Tiene algunos trucos de magia? Tal vez poniendo todos los guiones al final? use defer en lugar de async?

Answer 1

Después de una extensa investigación, definitivamente puedo decir que poner scripts al final de la página es LA mejor práctica.

Yahoo está de acuerdo conmigo: http://developer.yahoo.com/performance/rules.html#js_bottom

Google no se habla de esta práctica y parece preferir las escrituras asíncronas: https://developers.google.com/speed/docs/best-practices/rtt#PreferAsyncResources

en mi humilde opinión, poniendo guión al final de la página tiene varias ventajas sobre asíncrono/aplazar:

• que funcionará para todos los navegadores (sí, incluso IE;))
• Usted garantiza el orden de ejecución
• No es necesario utilizar $(document).ready o $(window).load
• Las secuencias de comandos pueden ejecutarse antes de las imágenes colocadas
• Como asíncrono/tardes, se mostrará la página más rápido
• Cuando el DOM desencadenar el evento ready, todos los scripts se cargan
• se puede optimizar mediante la fusión de todos los js en un solo archivo sin problema (por una herramienta como mod_pagespeed)

el único inconveniente que puedo ver es que el navegador no será capaz de poner en paralelo las descargas . Una buena razón para usar async/defer es cuando tienes una secuencia de comandos que es completamente independiente (no necesitas confiar en el orden de ejecución) y que no necesita ejecutarse en un momento específico. Ejemplo: Google Analytics.