Download di contenuti con blocco Javascript sul tuo sito Web durante la pagina

Question

È questo il modo migliore per includere javascript sul tuo sito web? http://www.webdigi.co.uk/blog/2009/avoid-javascript-blocking-content-download-on-your-website-during-page-load/

Answer 1

Il modo migliore per includere JavaScript sul tuo sito Web è includere il minor numero possibile di file alla fine della pagina *, dopo aver caricato tutto il markup e altre risorse. Farlo in questo modo ha anche l'ulteriore vantaggio di incoraggiare un & Quot; miglioramento progressivo < !> quot; modello di sviluppo.

* Yahoo spende attivamente una grande quantità di denaro nella ricerca di questo e ha dedicato persone a tempo pieno (incluso il brillante Steve Souders) che pubblicano le loro scoperte online e in modulo libro .

Answer 2

Non sembra una situazione adatta a tutti, quindi ricorro spesso a questo famoso articolo per aiutarmi a rispondere a domande del genere:

http://developer.yahoo.com/performance/rules.html

Answer 3

È stato menzionato in uno dei podcast, ma se si ospita il javascript su un dominio separato o anche un sottodominio, il browser può aprire più connessioni e scaricare sia js che il resto della pagina sul contemporaneamente. Questo è il motivo per cui molte persone scelgono di collegarsi all'istanza di jQuery di Google, piuttosto che alla propria. Questo esempio ha anche vantaggi nella cache, ma vale il principio fondamentale.

Answer 4

In poche parole l'articolo dice di allegare dinamicamente <script> nodi nel DOM per ottenere download paralleli di file di script. Funziona e non è una novità.

Tuttavia non menziona il più grande svantaggio del metodo: sebbene gli script vengano scaricati in parallelo, l'ordine in cui vengono eseguiti non è deterministico. IE li eseguirà nell'ordine in cui terminano il download, mentre Firefox li esegue nell'ordine in cui sono collegati nel DOM.

Questo è un problema. Ad esempio, supponiamo che lo script A e lo script B vengano aggiunti usando quella tecnica. Ora immagina che lo script A sia jQuery e lo script B faccia questo:

$(document).ready(function(){...})

In IE sei fregato se per qualsiasi motivo (es. traffico di rete, cache cache) lo script B termina il download prima dello script A, perché verrà eseguito prima che jQuery sia stato caricato.

Vedi questo articolo per una spiegazione migliore.

La risposta di Rex M è la risposta strada da percorrere.