riferimento javascript esterno vs. hosting della mia copia

Dovresti fare entrambe le cose:

Inizia con l'hosting da un CDN come Google perché probabilmente avrà un livello più alto -time rispetto al proprio sito e sarà configurato per il tempo di risposta più veloce. Inoltre, chiunque abbia visitato una pagina che si collega al CDN utilizzerà la copia cache del file, quindi non sarà nemmeno necessario scaricare nuovamente una copia, rendendo il caricamento iniziale ancora più veloce.

Quindi aggiungi un riferimento di fallback al tuo server nel caso in cui il CDN sia inattivo (non probabile, ma la sicurezza è sicura). I fallback sono relativamente facili da comprendere, ma devono essere personalizzati per adattarsi allo script utilizzato:

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script><script>if(!window.jQuery)document.write('<scriptsrc="/path/to/jquery-ver.sion.min.js"><\/script>');
</script>

Assicurati di non scrivere </script> ovunque all'interno di un elemento <script> , in quanto chiuderà l'elemento HTML e causerà il fallimento dello script. La semplice correzione consiste nell'utilizzare una barra rovesciata come escape: <\/script> .

_{Un motivo in più per fare entrambe le cose:}

Se scegli un CDN popolare è altamente improbabile che possa mai avere un downtime, comunque nel lontano lontano futuro (~ 18 mesi da ora dato La legge di Moore ) quando il formato di hosting cambia, o l'indirizzo è aggiustato, o la rete è posta dietro un paywall, o qualsiasi altra cosa, è possibile che il tuo link non funzionerà più così com'è. Se utilizzi un fallback, ti darà un po 'di tempo per adattarti a qualsiasi nuovo formato per l'hosting prima di dover tornare indietro attraverso tutti i siti Web che hai creato e modificare i link CDN.

_{un altro motivo per fare entrambe le cose:}

Recentemente sono stato colpito da una serie di interruzioni di internet. Sono stato in grado di continuare a lavorare localmente su progetti in cui avevo collegato copie locali di risorse di script, e ho scoperto rapidamente che c'erano un certo numero di progetti che necessitavano di avere copie locali collegate.

Ho avuto la stessa domanda, poi ho letto questo articolo e mi è stato venduto l'idea di consentire a Google di ospitare la mia libreria jQuery.

L'articolo afferma i principali vantaggi di lasciare che le tue librerie siano ospitate dalla Content Delivery Network (CDN) di Google:

• Latenza ridotta : gli utenti che non si trovano fisicamente vicino al tuo server potranno scaricare jQuery più velocemente da Google piuttosto che forzarli a scaricarlo dal tuo server posizionato in modo arbitrario.
• Parallelismo aumentato : i browser limitano il numero di connessioni che possono essere eseguite contemporaneamente. A seconda del browser, questo limite può essere pari a due connessioni per nome host. Utilizzo delle librerie AJAX di Google CDN elimina una richiesta al tuo sito, consentendo il download parallelo di più contenuti locali.
• Miglioramento del caching - Utilizzando le librerie AJAX di Google, i tuoi utenti potrebbero non aver bisogno di scaricare jQuery. D'altra parte, se stai ospitando localmente jQuery, gli utenti devono scaricarlo almeno una volta. Probabilmente ognuno dei tuoi utenti ha già dozzine di copie identiche di jQuery nella cache del browser, ma quelle copie di jQuery vengono ignorate quando visitano il tuo sito.

Per quanto riguarda i due punti elenco che hai elencato come professionisti per l'hosting della tua libreria, ricorda che è Google che ospita la versione cloud e Google sa cosa stanno facendo e può essere considerato affidabile per quanto riguarda la disponibilità e la sicurezza. Tuttavia, @zzzzBov è un ottimo punto nella sua risposta a questa domanda, in cui raccomanda anche di archiviare una copia locale della libreria e di impostarla per default nell'improbabile caso in cui la versione CDN non sia accessibile per nessuna ragione.

Personalmente, prendo spunto dal link

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>!window.jQuery && document.write(unescape('%3Cscript src="includes/js/libs/jquery-1.6.1.min.js"%3E%3C/script%3E'))</script>

Questo richiama il file jQuery principale da Google, ma se non viene caricato per qualche motivo, la riga successiva lo carica dal tuo server.

È preferibile utilizzare un CDN e, se questo CDN risulta essere Google, tanto meglio, come hanno notato sia @CFL_Jeff che @Morons.

Sto aggiungendo questa risposta per indicare qualcosa che spesso viene trascurato quando si punta altrove, che è evitare l'avviso di contenuto misto . Prendi in considerazione l'utilizzo di URL privi di protocollo, ad esempio:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js" type="text/javascript">
</script>

Ci sono ancora alcuni problemi di supporto nell'uso di URL privi di protocollo, quindi anche dare un'occhiata alle risposte su Posso modificare tutti i link http: // in // solo //? su SO, ma almeno provare a gestire potenziali avvisi di contenuto misto in alcuni modo.

Dovresti fare riferimento a Libreria di API di Google ..

Il motivo principale per questo è di velocizzare i carichi della pagina . Se l'utente ha già visitato un altro sito facendo riferimento alla stessa libreria, sarà già memorizzato nella cache del browser e non sarà necessario scaricarlo .

Potrei sbagliarmi, ma implementare document.write sovrascrive tutto ciò che il DOM ha. Poiché è buona pratica mettere i file JavaScript alla fine del corpo,

Propongo il seguente metodo basato su risposte precedenti:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">

if(!window.jQuery)
{
    //Creates the script element
    var script = document.createElement('script'); 
    //Adds the type attribute with "text/javascript" value
        script.setAttribute('type', 'text/javascript'); 
    //Adds the source attribute and populates it
        script.setAttribute('src', 'Put_The_Relative_Path_To_Your_JavaScript_File_Here'); 
    //Adds it to the end of the body, as it is good practice, to prevent render-blocking.  
    document.body.appendChild(script);

}

//Note that there's no need for you to verify with an onload function, since all scripts
//must be loaded before going to the next one! 

</script>

Vorrei aggiungere che l'hosting di una copia locale è una buona pratica perché nessuno dei precedenti afferma nulla di relativo a una postura sicura in cui la Posizione geografica e l'Elenco bianco rigoroso sono imperativi. Non ospitare quel file in locale presume di spingere una posizione di sicurezza ridotta sui tuoi clienti.