Troppo spesso, trovo del codice simile al seguente quando ispeziono il codice sorgente dei siti web che utilizzano jQuery:

<script type="text/javascript" src="/js/jQuery.min.js"></script>
Se stai facendo questo su un sito web, si sta facendo male.
Invece, vi esorto a usare le Google AJAX Libraries (rete di distribuzione di contenuti) per servire il codice jQuery agli utenti direttamente dalla rete attraverso il datacenters di Google.
In questo modo si ha diversi vantaggi rispetto allo stesso codice jQuery ospitato su server locale: una latenza ridotta, un maggiore parallelismo, e una migliore caching.

Tre ragioni
In questo post, espanderò il suo utilizzo, il vantaggio nell’uso di CDN di Google e mostrerò un paio di esempi su come sia possibile usufruire di questo servizio.
Possibili aggiornamenti: Dal momento che state leggendo questo post, potrebbe essere interessate sapere che Google ospita anche i temi di jQuery UI sulle API AJAX CDN.
Se hai già letto tutto questo e sei solo qui per il link, eccolo:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
  • Diminuire la latenza Un CDN — abbreviazione di Content Delivery Network — distribuisce i contenuti statici su più server in diversi luoghi fisici diversi. Quando il browser di un utente risolve l’URL di questi files, s’incomincia a scaricare automaticamente il suo contenuto dal server più vicino disponibile in rete.
    Nel caso di Google AJAX Libraries CDN, significa che gli utenti non fisicamente vicini al vostro server saranno in grado di scaricare jQuery più veloce anziché costringerli a scaricarlo dal server dove arbitrariamente si trova.
    Ci sono alcune altre servizi nel CDN ma questo beneficio da solo potrebbe decidere la questione, ma c’è ancora di più.
  • Aumento del parallelismo Per evitare di sovraccaricare inutilmente i server, i browser limitano il numero di connessioni che possono essere fatte contemporaneamente. Secondo il browser in uso, tale limite può essere basso come due connessioni per host.
    Utilizzando la Google AJAX Libraries CDN si eliminano queste richieste al tuo sito, permettendo più velocità dai vostri contenuti locali e scaricare in parallelo lo script. Non fa un’enorme differenza tra gli utenti con un browser da sei connessioni contemporanee, ma per quelli che ancora sono in esecuzione da un browser che permette solo due, la differenza è notevole.
  • Caching migliore Potenzialmente il più grande vantaggio di utilizzare la Google AJAX Libraries CDN è che gli utenti non devono scaricare jQuery tutte le volte.
    Non importa quanto sia ben ottimizzato il vostro sito, se si ospita la libreria jQuery nel server locale, gli utenti che visitano il sito lo devono scaricarlo almeno una volta. Ciascuno dei vostri utenti, probabilmente ha già decina di copie identiche di jQuery nella cache del browser, ma tali copie di jQuery vengono ignorate quando visitano il vostro sito.

    Tuttavia, quando un browser vede dei riferimenti di jQuery ospitati al CDN, capisce che tutti questi riferimenti si riferiscono esattamente allo stesso file. Con tutti questi riferimenti al CDN puntano esattamente agli stessi URL, il browser si può fidare veramente che questi file sono identici e non perdere tempo a richiedere il file se è già nella cache. Così , il browser è in grado di utilizzare una singola copia che è nella cache su disco, indipendentemente da quale sito provengano i riferimenti al CDN.
    Questo crea un potente effetto “cross-site caching” cui tutti i siti si beneficiano se usano il CDN. Poiché il CDN di Google serve il file, con intestazioni che tentano di memorizzare nella cache i file fino ad un anno, questo potenziale effetto è davvero sorprendente. Con le molte migliaia di siti più trafficati su Internet che già utilizzando il CDN di Google per servire jQuery, è molto probabile che molti dei vostri utenti non farà mai una singola richiesta HTTP per jQuery quando visitano siti che usano il CDN.
    Anche se qualcuno visita centinaia di siti che utilizzando la stessa versione di jQuery ospitata da Google, avranno bisogno di scaricarlo solo una volta!


Implementazione
A questo punto, probabilmente sei convinto che la Google AJAX Libraries CDN sia la strada maestra da percorrere per i siti pubblici che utilizzano jQuery. Quindi, lasciate che vi mostri come si può metterlo in uso.
Dei due metodi disponibili, questa opzione è quella che Google consiglia:
L’approccio di google.load() offre la massima funzionalità e prestazioni.
Per esempio:
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  // È possibile specificare i numeri di versione parziale, 
  // come ad esempio "1" o "1.3", con lo stesso risultato.
  // In questo modo si carica automaticamente la versione più  
  // recente in corrispondenza al modello parziale di revisione. 
  // Ad esempio 1.3 caricherebbe la versione 1.3.2 e 1 
  // caricherebbe la versione 1.7.1
  google.load("jquery", "1.7.1");
 
  google.setOnLoadCallback(function() {
// Inserire il codice di inizializzazione
// qui invece di $(document).ready()
  });
</script>
Mentre non c’è niente di sbagliato in questo, ed è sicuramente un miglioramento rispetto a jQuery se lo hosting è a livello locale, non sono d’accordo che offre le migliori prestazioni.
Peggiore ancora, non è possibile utilizzare in modo affidabile il gestore $(document).ready() in combinazione con questo metodo. Il gestore setOnLoadCallback() è un requisito.
Ritornando al basico
Di fronte a questi inconvenienti con il metodo google.load(), io suggerisco di usare una buona dichiarazione <script> vecchio stile. Google supporta anche questo metodo.
Per esempio
<script type="text/javascript"
 src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
   $(document).ready(function() {
  // Questo piace di più !
   });
</script>
Non solo questo metodo evita il ritardo dello JSAPI, ma elimina anche tre richieste HTTP inutili. Io preferisco e consiglio questo metodo.
Se sei curioso perché il riferimento allo script non è presente il protocollo http:, è un trucco utile che consente di utilizzare un unico riferimento che funziona su entrambe le pagine HTTP e HTTPS, chiamato anche protocol-less. Quando il protocollo di un URL viene omesso, il browser utilizza il protocollo del documento corrente.
Conclusione
Secondo uno studio recente, Google ha consumato il 16,5% di tutta la capacità dell’utente Internet negli Stati Uniti nel corso del 2008. Penso che sia giusto dire che sanno servire in modo efficiente un po’ di contenuti.
Che ne pensi? State usando la Google AJAX Libraries CDN sui vostri siti? Riuscite a individuare uno scenario in cui il metodo google.load() si comporta meglio della semplice dichiarazione <script>?
Aggiornamento: Microsoft offre ora un servizio simile per MicrosoftAjax.js.
Similari
Il framework jQuery e jQuery-plugins
16% Plugins
jQuery è una ben nota libreria Javascript Web 2.0 light-weight cross-browser, sviluppato da un team guidato da John Resig. jQuery è costruito sulla cima di Sizzle, che è un motore per i selettori CSS scritto in Javascript …
Gruppi di 50 e passa esempi in Ajax
15% Ajax
Le applicazioni web hanno fatto passi da gigante nel miglioramento della user experience, grazie anche alla tecnologia Ajax. Quando si combinano le funzionalità di PHP con la bravura di javascript si possono produrre risul…
Estendere Google Analytics con jQuery
12% Plugins
Da un bel po’ di tempo Google Analytics ha aperto la strada per la raccolta gratuita di statistiche del traffico del proprio sito web. Sono sicuro che molti di voi abbiano installato il codice di Google sui vostri siti e a…
Precaricare immagini
12% JScript
La precarica delle immagini è un ottimo modo per migliorare la user experience. Quando le immagini sono precaricate nel browser, il visitatore può navigare ovunque nel nostro sito e disporre di tempi di caricamento più vel…
Come verificare se un file esiste utilizzando jQuery
12% JQuery
Il modo migliore per farlo è con una richiesta AJAX HEAD. Le richieste HEAD sono molto più veloci delle richieste POST o GET e ritorna l’intestazione dal file di destinazione. Vale anche la pena notare che una richiesta HE…