Para los ansioso, el tip: Poner todos los javascript al final de la página antes del tag </body>
La explicación:
Parece muy simple, pero la mayoría de los desarrolladores web, cuando programamos un web site, tenemos por costumbre poner los javascript dentro del HEAD. Sin saber que esto afecta notablemente el tiempo de carga de nuestro página, ya que los browsers trabajan de la siguiente manera:
- Cargan siempre primero el HTML,
- Luego interpretan las instrucciones del mismo
- Si encuentran algun componente externo (CSS, Javascript, IMG, etc) lo descargan.
- Pero el tag SCRIPT tiene un comportamiento especial, hace que el browser detenga la ejecución, ya que el mismo podría tener una instrucción que modifique la ventana o documente, como por ejemplo document.write
Es por eso que si ponemos los scripts al principio el browser no ejecutara ni mostrara nada hasta que no descargue los scripts que le indiquemos. Y generalmente se pueden poner sin mayores problemas al final de la página.
Hay algunos casos donde no es posible mover hacia el final a los scripts, ya que los mismos realizan modificaciones en el contexto, clásico ejemplo los ads. Esto nos quita mucha performance en nuestro web site o webapp, y antes podíamos solucionarlo poniendo el atributo DEFER en el script. Pero lamentablemente esto no funciona en FireFox y otros. Un excelente ejemplo de esto y algunos comentarios de como solucionarlo según el browser lo podemos encontrar en la página de Steve Souders.
Dentro de poco les voy a pasar un tip de como solucionar la carga de ads, sin perder la performance de nuestra web
Saludos