Ordine di caricamento file CSS e JavaScript esterni

Question

Ho un'applicazione di terze parti che carica molti file css e javascript e ora voglio ottimizzare questo concatenando tutti i javascript in un unico file, compresso dal yuicompressor, ma. .. quando abbiamo un mix come:

<script type="text/javascript" src="script1.js"></script> 
<script type="text/javascript" src="script2.js"></script> 
<link rel="stylesheet" href="style1.css" type="text/css" /> 
<script type="text/javascript" src="script3.js"></script> 
<script type="text/javascript" src="script4.js"></script> 

Non importa che ci sia un css in mezzo qui? Dovrei concatinare e yuicomprimere i 4 javascript e caricarli prima del CSS o dopo?

Answer 1

Non dovrebbe importare in alcun modo.

Answer 2

Non importa, anche se il caricamento richiede un po ', l'utente potrebbe vedere la sua pagina cambiare aspetto e chiedersi perché. Metterei prima i file CSS per avere le definizioni di stile in atto prima di qualsiasi manipolazione DOM, molto probabilmente riducendo al minimo le modifiche visibili al caricamento della pagina, ma alla fine non ha molta importanza.

Answer 3

Dipende. Se tutto il JS funziona solo su DOM ready, l'ordine non è importante. Tuttavia, se c'è qualche javascript in linea che modifica lo stile CSS degli elementi DOM, avrai problemi.

Più in pratica, è consigliabile inserire prima il CSS in modo tale che ci sia meno tempo in cui l'utente deve sperimentare contenuti non programmati.

Answer 4

Verificare Yahoo's Best Practices for Speeding Up Your Web Site, si consiglia di caricare prima il proprio css (preferibilmente nell'intestazione) e il proprio js l'ultimo (dopo tutto il contenuto nel corpo). Google's best practices consiglia inoltre di caricare prima CSS.