Skip to content

Tutti i modi per includere jQuery in una pagina HTML

Torna agli articoli

L’inclusione di jQuery in una pagina HTML per quanto possa sembrare una pratica “scontata” può avvenire molti modi. Ognuno di questi ha i propri PRO e propri CONTRO, vediamo quali sono.

Il più classico è quello di scaricare jQuery (in versione minimizzata o estesa) dal sito ufficiale, copiarlo nella cartalla “javascript” della nostra applicazione web e collegarlo tramite l’inclusione del file.

  

Un’alternativa è collegarlo direttamente al repository di jQuery, in sostanza basta copiare l’URL della versione jQuery che ci interessa (nel nostro caso la 1.6.4) dal sito ufficiale e collegarlo tramite l’inclusione del file.

  

Un’altro metodo è quello di sfruttare le Librerie Ajax di Google per collegare jQuery. E’ una procedura che molti sviluppatori non sono soliti ad utilizzare ma offre moltissimi vantaggi. Vediamo innanzitutto come tramite le librerie di Google possiamo includere jQuery nelle nostre pagine:

  

Sempre tramite tali librerie è possibile collegare jQuery (e altri framework Javascript) richiamandolo direttamente dalle API di Google.
In questo caso l’inclusione è leggermente diversa:
Invece di includere il file fisico di jQuery includiamo il javascript delle API di Google:

  

A questo punto dentro un tag script Javascript carichiamo jQuery :

  

E’ possibile omettere la versione di jQuery, lo script includerà l’ultima versione disponibile di tale libreria.
Stesso discorso vale per le altre librerie Javascript collegabili (qui l’elenco completo).
Non resta che attivate il DOM :

  

Quale scegliere?
Ora, la domanda che mi sono posto e che penso possa essere venuta in mente a molti è: perchè includere jQuery in modo diverso da quello che ho fatto fin’ora? E quale scegliere di questi?
Premesso che tutti i metodi sono funzionanti, vediamo quali sono i fattori che entrano in gioco:

Ottimizzazione di caricamento
La cache è il mezzo per cui i nostri browser mantengono in memoria dati e pagine immagazzinati in sessioni precedenti. Questo avviene per favorire la navigazione alle connesioni analogiche e per rendere ancora più veloce il caricamento di elementi comuni da sito a sito.
Ecco perchè effettuando il caricamento di jQuery dai server Google può intervenire la cache andando a recuperare uno script (nel nostro caso jQuery) già caricato nel nostro browser da qualche sessione precedente.
Un’altro modo per favorire il caricamento delle nostre pagine è affidarsi al “parallelismo”.
Il parallelismo è quel fenomeno che permette di caricare insieme uno script su un server esterno ed uno script presente sul server dove risiede la pagina.
Questa metodologià favorisce il caricamento perchè permette code di caricamento meno lunghe favorendo l’inizializzazione di script interni ed esterni alla pagina.
Ovviamente, se jQuery viene incluso da un server esterno permetterà di caricare simultaneamente script o dati presenti sulla nostra pagina web.

Scalabilità
Il fattore della scalabilità entra in gioco quando è possibile far “crescere” o “decrescere” uno script.
L’ultimo metodo di inclusione che abbiamo visto (inclusione tramite API Goolge) infatti permette di utilizzare sempre l’ultima versione disponibile o di scegliere una versione meno recente.

Compatibilità
La compatibilità tra i vari framework Javascript non è da sottovalutare, tanti sono le nuove librerie Javascript che stanno nascendo e tante fanno uso del carattere ‘$’.
L’inclusione tramite le API di Google permette senza aggiunta di codice di utilizzare tutte le librerie che vogliamo senza alcuni conflitto.

Preventivo Gratuito