In un progetto Web corrente, sto utilizzando diversi plugin jQuery e li inizializzo poco prima del tag body di chiusura. La mia domanda è, dal punto di vista del tempo di caricamento/prestazioni, sarebbe meglio per me prendere tutte queste inizializzazioni e copiarle in un unico file js esterno? i plugin vengono inizializzati allo stesso modo all'interno di tutte le pagine del sito, quindi sembrerebbe caricarne uno, il file centralizzato sarebbe il migliore, no? grazie per qualsiasi feedbackDevo copiare tutte le mie origini JavaScript in un singolo file?
Tutto dipende da cosa si sta sviluppando, ma qui ci sono alcune regole pratiche.
Le richieste HTTP indicano un sovraccarico (soprattutto su HTTPS), quindi cerca di fare il meno possibile, per i dispositivi mobili questo è fondamentale. ci sono tuttavia alcune eccezioni; caricamento lento dei file JavaScript che non sono necessari quando l'app viene inizializzata a volte è intelligente, quindi vengono memorizzati nella cache quando è veramente necessario, l'utilizzo di una rete CDN per le librerie popolari a volte può portare a un notevole aumento delle prestazioni a causa dei download paralleli.
mantieni il download il più piccolo possibile, quindi riduci tutto il codice JavaScript e CSS, alcuni addirittura minimizzano l'HTML.
assicurati che le intestazioni della cache siano impostate correttamente (alcune le impostano su un anno o più) e quando viene distribuita una nuova versione del tuo script, aggiungi l'attributo src dell'elemento di script con un numero di versione per contrastare la cache, come : <script src="myapp.js?v=2"></script>
A volte le prestazioni percepite sono migliori delle prestazioni reali, ovvero; il caricamento e il rendering dell'HTML sono più importanti dell'applicazione inizializzata. questo può essere fatto caricando in modo asincrono i file JavaScript (inserendo elementi di script con JavaScript come fa Google o usando i caricatori di script che fanno questo per te). ma questo porta a nuove sfide come l'ordine di esecuzione dei file caricati o l'interazione con la pagina prima che i file di script siano completamente caricati e analizzati.
Alla fine dipende in gran parte dall'architettura della tua app o del tuo sito online e qual è l'interazione con esso o dovrebbe essere, cura di approfondire fornendo alcuni esempi?
grazie per l'ottimo feedback PM5544. Sono particolarmente curioso di saperne di più sul caricamento js asincrono per migliorare le prestazioni. Ecco un esempio di un piccolo sito che ho fatto ad un amico per mostrare la sua opera d'arte: http: // tinyurl.com/758ocgo Sto usando alcuni plugin jQuery e sarei curioso di sapere se c'è qualcosa che dovrei fare in modo diverso per ottimizzare le prestazioni. –
nickpish
+0
In questo caso specifico ti consiglierei di fare quanto segue; combinare i plugin in un file JavaScipt piuttosto che ridurlo. sposta tutti gli elementi '
1
Qualsiasi quantità significativa di codice javascript è meglio in un comune file javascript esternalizzato perché può essere memorizzato nella cache in modo più efficiente tra tutte le pagine.
Alcune righe di codice in linea nella pagina prima del tag di chiusura del corpo per chiamare un codice di inizializzazione in un file javascript esternamente è perfettamente soddisfacente e non rallenta nulla se questo è il modo migliore per attivare l'inizializzazione.
Sì, è possibile minificare JavaScript e CSS in singoli file utilizzando strumenti come YUI Compressor. Ma mettere tutte le risorse in file singoli può essere problematico: se i file sono grandi, il browser può utilizzare solo un singolo flusso TCP per scaricarli, rispetto a più richieste simultanee. Per saperne di più su questo qui: Loading JavaScript Resources the Fun Way
Per quanto riguarda dove mettere i <script> tag nel codice HTML, la risposta è in fondo alla pagina prima della chiusura </body> tag. Dai un'occhiata al sito di Google Web Performance Best Practices.
grazie per l'ottimo feedback PM5544. Sono particolarmente curioso di saperne di più sul caricamento js asincrono per migliorare le prestazioni. Ecco un esempio di un piccolo sito che ho fatto ad un amico per mostrare la sua opera d'arte: http: // tinyurl.com/758ocgo Sto usando alcuni plugin jQuery e sarei curioso di sapere se c'è qualcosa che dovrei fare in modo diverso per ottimizzare le prestazioni. – nickpish
In questo caso specifico ti consiglierei di fare quanto segue; combinare i plugin in un file JavaScipt piuttosto che ridurlo. sposta tutti gli elementi '
Qualsiasi quantità significativa di codice javascript è meglio in un comune file javascript esternalizzato perché può essere memorizzato nella cache in modo più efficiente tra tutte le pagine.
Alcune righe di codice in linea nella pagina prima del tag di chiusura del corpo per chiamare un codice di inizializzazione in un file javascript esternamente è perfettamente soddisfacente e non rallenta nulla se questo è il modo migliore per attivare l'inizializzazione.
fonte
2011-11-13 07:10:51 jfriend00
questo ha senso; grazie james – nickpish
Sì, è possibile minificare JavaScript e CSS in singoli file utilizzando strumenti come YUI Compressor. Ma mettere tutte le risorse in file singoli può essere problematico: se i file sono grandi, il browser può utilizzare solo un singolo flusso TCP per scaricarli, rispetto a più richieste simultanee. Per saperne di più su questo qui: Loading JavaScript Resources the Fun Way
Per quanto riguarda dove mettere i
<script>tag nel codice HTML, la risposta è in fondo alla pagina prima della chiusura</body>tag. Dai un'occhiata al sito di Google Web Performance Best Practices.fonte
2011-11-22 08:08:12