Cómo incluir JavaScript en un sitio web de cara pública?

Question

Estoy construyendo un sitio web público y estoy usando una gran cantidad de jQuery y jQueryUI. Lo que he notado es que la mayoría de los sitios en internet que usan jQuery y jQueryUI no tienen un código como este en sus páginas.

<script type="text/javascript"> 
    $(document).ready(function(){ 

    $("a").click(function(event){ 
     alert("Thanks for visiting!"); 
    }); 

    $("input:submit").button(); 
    }); 
</script> 

Sé que este es un ejemplo simplista, pero la mayoría de los sitios, por ejemplo, también lo han hecho sólo un ofuscado js archivo incluido para todas las páginas. Ni siquiera parece que usen $ (documento). Listo en cualquier lugar. En mi sitio actual, parece que debería incluir un archivo js para cada página. Mi pregunta es ¿cómo se supone que debe hacerse y hay una mejor práctica sobre cómo usar/incluir Javascript en una página?

Answer 1

Según W3C se puede poner guiones en casi cualquier lugar: http://www.w3schools.com/js/js_whereto.asp

Así por dónde debe ponerlos?

Ege es correcto decir que usted debe poner en la medida de abajo de la página como sea posible, ya que permitirá que el navegador cargue más en paralelo por adelantado antes de que llegue a los scripts '' de bloqueo. Vea aquí para más detalles: http://developer.yahoo.com/performance/rules.html#js_bottom

Además, es casi siempre una buena idea poner las secuencias de comandos (y CSS) en archivos externos, de modo que el navegador puede almacenar en caché ellos tus ahorrando al usuario de tener que descargarlos con la página de cada uno hora.

Personalmente, siempre uso un CDN para marcos de guiones como jQuery y similares, ya que pueden entregar recursos externos más rápido de lo que probablemente pueda. También es mucho más probable que el navegador ya haya almacenado en caché jQuery para otro sitio del mismo CDN. Más detalles aquí: http://code.google.com/apis/libraries/devguide.html

Por último, no hay nada de malo con el uso de $ (documento) .ready, pero ten en cuenta que esto podría afectar la capacidad de respuesta del sitio y sus ventajas pueden superar sus inconvenientes. De nuevo, más detalles aquí: http://encosia.com/2010/08/18/dont-let-jquerys-document-ready-slow-you-down/

Espero que haya sido de ayuda.

Answer 2

No verá el documento famoso. Listo porque la mayoría del código se comprime normalmente en un archivo grande para el almacenamiento en caché. Basta con incluir sus js en el extremo del cuerpo como:

<script type="text/javascript" src="site.js"></script> 

por lo que este puede almacenar en caché una vez por todas para cada página.

Answer 3

No importa si incluye el archivo 'site.js' en la parte superior o inferior, a menos que su javascript esté haciendo document.write para poner algo en la página. Entonces, por supuesto, en la parte superior sería deseado. A algunos les gusta en la parte inferior para que el resto de la página se cargue antes de descargar el archivo js, ​​lo que a veces puede retrasar la carga de la página si se trata de un archivo grande.