Best practice: include (o < script src = "

Question

Ho minimizzato il mio javascript e il mio css.

Ora, quale è meglio?

<script type="text/javascript">
<?
  $r = file_get_contents('min.js');
  if($r) echo $r;
?>
</script>

o

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

Stessa domanda per CSS.

Se la risposta è "a volte perché i browser recuperano i file contemporaneamente?" Quali browser e quali sono esempi dei tempi in entrambi gli scenari.

Answer 1

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

... è meglio, poiché il browser dell'utente può memorizzare nella cache il file.

L'aggiunta di un parametro al src come l'ultimo timestamp modificato del file è ancora migliore, poiché il browser dell'utente memorizzerà il file nella cache ma recupererà sempre la versione più aggiornata quando il file viene modificato .

<script type="text/javascript" src="min.js?version=20081007134916"></script>

Answer 2

È meglio includere il più delle volte file javascript e css perché in questo modo il browser è in grado di memorizzare nella cache il file javascript / css. In questo modo il file viene caricato una sola volta dal browser anche se si include il file in diverse altre pagine.

Ma questo è vero solo se si imposta un'intestazione di scadenza e / o controllo cache appropriata per i file javascript e css tramite php o Apache mod_expires.

Sulla base della raccomandazione della Yahoo Exceptional Performance, esiste una sola eccezione:

  

L'unica eccezione in cui è preferibile inline è con le home page, come la prima pagina di Yahoo! e My Yahoo !. Le home page che hanno poche (forse una sola) visualizzazione di pagina per sessione potrebbero scoprire che la presenza di JavaScript e CSS comporta tempi di risposta più rapidi per l'utente finale.

Consiglio vivamente di provare l'Aggiunta " YSlow per Firebug " ;. Risponde a molte domande sulla memorizzazione nella cache e sulle prestazioni del browser / client.

Vedi anche:

Mod_expires di Apache

Best practice per velocizzare il tuo sito web

YSlow

Answer 3

Ricorda che il browser può scaricare QUASI due file in parallelo dallo stesso dominio (che è l'impostazione predefinita sui browser moderni - sono sicuro di IE6 e IE7, non sono sicuro degli altri). Ciò significa che se la tua pagina fa riferimento a 20 piccoli file javascript, molti verranno scaricati in sequenza.

Per aggiungere ciò che è stato già detto: ricorda che se combini / minimizzi i tuoi file javascript, è meglio unirli tutti in uno: la compressione funzionerà meglio. Inoltre, anche se non minimizzi i tuoi file, ricorda di attivare GZIP nella configurazione del tuo server web; quindi, se unisci tutti i tuoi file JS in uno e includi quel file come, la compressione GZIP funzionerà meglio (perché comprimere due file JS insieme produce risultati migliori rispetto a comprimere ciascuno separatamente).

Se stai cercando una buona utility di minificazione JS, prova JS Packer ( http: // dean. edwards.name/packer/ )