¿Cuántas son demasiadas incluidas en <HEAD>?

He hecho algunas búsquedas sobre esto pero no puedo encontrar ningún tipo de práctica recomendada o recomendación, y tal vez sea porque no hay ninguna. Estoy usando todo tipo de complementos jQuery en mi sitio, además de TinyMCE y algunos otros complementos, y el archivo JS específico de mi sitio. Además de eso, tengo tres hojas de estilo ... ¡y viene más a medida que crece el sitio!¿Cuántas son demasiadas incluidas en <HEAD>?

¿Hay algún tipo de "límite" o algo que deba estar atento para incluir scripts en la etiqueta? Sé que cada una es otra solicitud de HTTP que debe completarse, pero si se minimizan y son lo más pequeñas posible, ¿habrá problemas?

<link rel="stylesheet" type="text/css" href="http://mysite.com/assets/css/redmond.css" /> 
    <link rel="stylesheet" type="text/css" href="http://mysite.com/assets/css/style.css" /> 
    <link rel="stylesheet" type="text/css" href="http://mysite.com/assets/css/jqueryFileTree.css" /> 

    <!--[if gte IE 7]> 
     <link rel="stylesheet" type="text/css" href="http://mysite.com/scripts/style.ie.css" /> 
    <![endif]--> 

    <script type="text/javascript" src="http://mysite.com/assets/js/jquery.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jquery-ui.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jqueryFileTree.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jqminmax.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jquery.corner.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jquery.jeditable.js"></script> 
    <script type="text/javascript" src="http://mysite.com/assets/js/jquery.qtip.js"></script> 

    <script type="text/javascript" src="http://mysite.com/assets/plugins/tinymce/tiny_mce.js"></script> 

    <script type="text/javascript" src="http://mysite.com/assets/js/latitude.js"></script>

Fuente

2009-07-27 Nathan Loding

¿No es el tiempo de descarga todo el límite que importa? ¿Que estas preguntando? ¿Qué tan lenta es una descarga demasiado lenta? –

Sí, el tiempo de descarga es todo lo que importa. Pero no conozco una manera de combinar los archivos JS fácilmente y me preguntaba qué pensaban los demás sobre cuántos son "demasiados". –

La utilidad 'cat' de UNIX es una buena forma de combinar archivos JS. – Quentin

¡No es bueno!

Recomendaría combinar estos archivos en un js y un css usando un script antes de implementarlo en vivo. Hay muchas razones por las que esto no es bueno, ver el siguiente enlace para más información:

http://developer.yahoo.com/performance/rules.html

Editar: Para responder a más No, no hay límites en el número de archivos, pero la mayoría de los navegadores pueden solo tiene 2 conexiones (para un sitio) a un servidor web en cualquier momento y cargará sus archivos js 2 a la vez. El YSlow plugin para firefox le mostrará un gráfico de cómo se están descargando sus archivos.

Si está utilizando ASP.NET, este artículo codeproject podría ayudar, si está en linux, entonces this podría ayudar.

Editar: Un archivo por lotes simple en ventanas (para conectar a sus herramientas de construcción) sería

@echo off 
copy file1.js + file2.js + file3.js merged.js /b

Fuente

2009-07-27 16:04:15 Frozenskys

¿Cómo combino los archivos JS? Solo copie y pegue todo el código en una cosa gigante y luego minífela. –

C/P después de la minificación debería funcionar también. – millimoose

Entre esto y la biblioteca de YUICompress, creo que debería estar bien. Gracias por toda la entrada! –

Cuanto más archivos CSS y JS haga referencia en una página, más tardará en cargarse. Es mucho mejor combinarlos en el menor número de archivos posible.

Fuente

2009-07-27 16:00:42 Eifion

Muchos navegadores abrirán 2 conexiones concurrentes al servidor, paralelizando efectivamente la descarga, hay trucos que puede hacer al almacenar contenido en otros dominios/subdominios para engañar al navegador y configurar más de esas 2 conexiones para descargar cosas. Es un equilibrio entre tamaño y nr de archivos. – nos

Si te ayuda a sentirte mejor, muchos otros sitios están "cargados" así y los archivos js están en la memoria caché prácticamente todos los navegadores modernos (e incluso antiguos). Una cosa que podría ayudar sería vincular su archivo jquery a uno alojado en el sitio googleapis, porque podría existir la posibilidad de que otro sitio esté enlazando al mismo archivo jquery alojado allí y ya esté en su caché:

http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js

Su servidor web ya debería optimizar los archivos habilitando automáticamente la compresión gzip, pero vuelva a verificar para asegurarse.

Fuente

2009-07-27 16:01:58

Todavía será muy lento en cargas de "caché fría", p. primera visita. Y hay datos de Yahoo que dicen que un gran porcentaje de visitas al sitio son caché en frío. – Frozenskys

No sé si hay existe una buena respuesta para este tipo de preguntas, pero si Si está interesado en la optimización, ¡hay un montón de ellos hechos por Yahoo !: http://developer.yahoo.com/performance/rules.html.

Personalmente, tiendo a ignorar la mayoría de esas reglas, simplemente porque el tipo de cosas que estoy construyendo no son tan grandes.

Fuente

2009-07-27 16:05:03 JHollanti

Los navegadores tienen un límite en el número de solicitudes concurrentes a un dominio, por lo que pueden ralentizar la carga de otros elementos en su página. Por ejemplo, IE8 has a limit of 6 concurrent connections, and IE7 has a limit of 2.

Recomiendo combinar los archivos que aloja localmente, hacer referencia a otros externamente (por ejemplo, en Google) y mover potencialmente otros al final de la página para que no demoren la carga.

Puede combinar scripts con muchas herramientas en línea, como jsCompress. Tiene una pestaña "Subir archivos", por lo que puedes subir todos tus archivos js y se comprimirán y minimizarán.

También hay utilidades del lado del servidor que lo harán por usted. No dice qué tecnología del servidor está utilizando, pero, por ejemplo, en el mundo PHP puede usar Minify.

Fuente

2009-07-27 16:08:08

Google Page Speed es tu amigo. Parece ser básicamente YSlow con esteroides.

Fuente

2009-07-27 16:13:05 millimoose

¿Cuántas son demasiadas incluidas en <HEAD>?

Respuesta

Cuestiones relacionadas