Bundling .js file vs CDN

Question

Per migliorare le prestazioni delle nostre pagine Web, si consiglia di utilizzare CDN s per servire i file .js sulle nostre pagine Web. Ciò ha senso.

Inoltre, si consiglia di raggruppare i file .js in modo da ridurre il numero di richieste che vengono effettuate al server al caricamento.

Quindi, abbiamo bisogno di sederci e prendere una decisione tra se usiamo CDN o bundle file .js.

Quali sono i pro e i contro? Quali hanno più senso?

Answer 1

Perché non è possibile raggrupparli e posizionarli come CDN? Non dovrebbe essere una decisione dell'uno o dell'altro?

Se il numero ha per scegliere l'uno o l'altro, dipende dal numero di file .js che si includono. Per un piccolo numero di file, avevo suggeriscono che una CDN sarebbe più veloce, in cui, come per un maggior numero di file, un fascio di .js file sarebbe sicuramente essere più veloce. Dove dovrebbe essere il passaggio, è qualcosa per te da sperimentare.

Answer 2

La mia risposta: entrambi. Raggruppali e posizionali su un CDN.

Lo svantaggio di fare questo? Dipende. Come è strutturato il processo? Puoi automatizzare facilmente il raggruppamento e la minificazione? Stai usando Yahoo YUI o Google Closure o qualcos'altro?

Inoltre, se c'è un sacco di jQuery dipendente dalla GUI potrebbe esserci un certo dispendio di tempo a causa di elementi/effetti/css in continua evoluzione.

Il test è importante anche perché a causa di possibili stranezze minification.

Bottom line: 5 file javascript in sicurezza raggruppati in 1 file === 4 richieste in meno.

Una pagina con solo semplice Html vecchio e un riferimento javascript esterno === 2 richieste al server. Tuttavia, una pagina con un semplice Html vecchio e un riferimento javascript esterno su una richiesta CDN === 1 al tuo server.

Attualmente stiamo utilizzando gli strumenti di chiusura di Google. Il Google Closure Inspector aiuta con il seguente:

Closure Compiler modifica il codice JavaScript originale e produce codice che è più piccolo e più efficiente di quella originale, ma più difficile da leggere e correggere. Closure Inspector aiuta fornendo una funzione di mappatura delle fonti, che identifica la linea del codice sorgente originale che corrisponde al codice compilato.

Answer 3

Come altri hanno già affermato, la risposta è sia se possibile. In bundle (e minifying) dà un vantaggio ai tuoi utenti perché diminuisce il peso della pagina. Il CDN avvantaggia i tuoi server perché stai scaricando il lavoro. In generale, non è necessario ottimizzare nessuno dei due se non si sono osservati problemi di prestazioni o semplicemente non si ha nulla di meglio da fare.

Answer 4

Ci sono alcune cose che dovete pensare a ...

Quanto del JS Avete bisogno di caricare nelle prime fasi del caricamento della pagina, e quanto si può ritardare fino a tardi?

Se è possibile posticipare il caricamento di JS (ad es. Inserirlo nella parte inferiore della pagina) o caricarlo in modo asincrono come fa Google Analytics, quindi si riduce al minimo il tempo di scaricamento del JS che spende il thread dell'interfaccia utente.

Dopo aver analizzato il modo in cui è possibile suddividere il carico del JS, mi occuperei dell'unione/minificazione dei vari file JS: ridurre le richieste HTTP è fondamentale per migliorare le prestazioni.

Quindi passare al CDN e assicurarsi che il CDN possa servire il contenuto JS compresso e consentire di impostare le intestazioni in modo che siano "memorizzate nella cache per sempre" (sarà necessario eseguire la versione dei file se si memorizza nella cache per sempre). Un CDN aiuta a ridurre la latenza, ma ridurrà anche le dimensioni senza essere privi di configurazione

Un'altra cosa che potreste voler considerare è la creazione di un dominio separato per il contenuto statico, puntarlo verso il vostro server (s) mentre ordinate le cose e poi passare a un CDN se sembra utile.

Andy