Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
programming:js-loading-techniques [2014/08/11 13:06] – Giuseppe Di Terlizzi | programming:js-loading-techniques [2014/08/16 02:04] (current) – Giuseppe Di Terlizzi | ||
---|---|---|---|
Line 1: | Line 1: | ||
- | ====== JavaScript: | + | ====== JavaScript: |
+ | |||
+ | {{http:// | ||
===== Dove posizionare lo script ===== | ===== Dove posizionare lo script ===== | ||
Line 7: | Line 9: | ||
==== Sezione Head ==== | ==== Sezione Head ==== | ||
- | Caricare uno script JS nella sezione ''< | + | Caricare uno script JS nella sezione ''< |
- | + | ||
- | Nel caso in cui lo script risiede su un server molto lento, all' | + | |
<code html> | <code html> | ||
Line 23: | Line 23: | ||
</ | </ | ||
+ | Nel caso in cui lo script risiede su un server molto lento, all' | ||
+ | |||
+ | <div tip round 90% center> | ||
Un modo per velocizzare il caricamento degli script e stili CSS con PHP è l' | Un modo per velocizzare il caricamento degli script e stili CSS con PHP è l' | ||
Line 33: | Line 36: | ||
</ | </ | ||
- | In questo modo il browser non attende il dowload di tutta la pagina HTML per iniziare il caricamento degli script e stili css, ma riceve per primo tutta la sezione ''< | + | In questo modo il browser non attende il dowload di tutta la pagina HTML da parte del webserver |
+ | </ | ||
==== Sezione Body ==== | ==== Sezione Body ==== | ||
Situato alla fine della sezione ''< | Situato alla fine della sezione ''< | ||
- | Questo si traduce in un caricamento e visualizzazione più rapida della pagina, senza eventuali blocchi nel caso in qui il server che ospita lo script sia molto lento. | + | Questo si traduce in un caricamento e visualizzazione più rapida della pagina |
- | Questa tecnica è utile nel caso in cui nel nostro | + | Spostare il codice JS in fondo pagina ci aiuta nel caso in cui nel nostro |
<code html> | <code html> | ||
Line 66: | Line 70: | ||
</ | </ | ||
- | <div round tip center | + | <div round tip center |
L' | L' | ||
</ | </ | ||
Line 72: | Line 76: | ||
==== Metodo document.write ==== | ==== Metodo document.write ==== | ||
- | < | + | Questo metodo è andato in disuso ma nel caso eccolo qui: |
+ | |||
+ | < | ||
< | < | ||
document.write('< | document.write('< | ||
Line 80: | Line 86: | ||
==== Metodo DOM ==== | ==== Metodo DOM ==== | ||
- | Questo metodo permette di aggiungere al volo con JavaScript uno script esterno utilizzando i metodi DOM. | + | Questo metodo permette di aggiungere al volo con JavaScript uno script esterno utilizzando i metodi |
<code javascript> | <code javascript> | ||
Line 89: | Line 95: | ||
</ | </ | ||
- | Come potete vedere lo script è molto semplice, si crea un elemento '' | + | Come potete vedere lo script è molto semplice, si crea un elemento '' |
Una soluzione molto elegante è utilizzare una variante allo script //isogram// utilizzato da **Google Analytics**. | Una soluzione molto elegante è utilizzare una variante allo script //isogram// utilizzato da **Google Analytics**. |