Ci sono degli svantaggi nel concatenare tutti i file JavaScript (incluso il fornitore)

Question

Per ridurre al minimo il numero di richieste fatte al mio server e migliorare il tempo di caricamento, stavo pensando di concatenare tutti i miei file JS, inclusi i file js del fornitore come angolare, jquery- ui, ... È prassi comune farlo, ma spesso vedo siti Web che non includono i file JS del fornitore nello stesso file JS. So che molti siti utilizzano CDN per riutilizzare una versione memorizzata nella cache del file JS che potrebbe essere stata utilizzata da un'altra pagina. Howewer, a volte, sono file separati vendor JS che sono serviti sullo stesso server, ad esempio su Github:

Github ha:

• Frameworks.js che contiene Modernizr, jQuery
• github -... js che contiene JS da Github stesso.

C'è una ragione particolare per farlo? Sono problemi che potrebbero apparire perché concatri tutti i tuoi file JS?

Answer 1

Il motivo principale è ridurre al minimo il numero di richieste http. In un progetto più grande se si utilizza un pattern come MV * si potrebbe voler astrarre ciascun modulo in un file .js esterno. Questo può comportare molti file 30-40 per esempio. In tal caso potresti voler concat poi in un singolo file.

In un progetto più piccolo in cui si avrà 3-4 file js, si utilizza quindi senza concatenazione. Io uso requirejs per definire i moduli come AMD e avere ogni modulo in un file esterno. Quindi utilizzo lo script di compilazione requirejs per gestire la dipendenza e il file di distribuzione concatenato.

buoni strumenti per automatizzare questo processo

• RequireJS
• GruntJS

Answer 2

prestazioni saggio non sta andando a fare la differenza. Se sei infastidito dall'avere un file separato per tutti i tuoi framework, allora immagino che potresti farlo. Altrimenti si andrà a riempire un singolo file e potenzialmente si avranno problemi durante il tentativo di aggiornare i framework in un secondo momento.

Answer 3

Dipende da come è la tua domanda. Ipoteticamente, dì se hai 20 file js da 0,5 MB ciascuno. Di cui sono richiesti solo 2 (1 MB) sulla prima pagina. Potresti voler tenerli separati e combinare gli altri. Carica gli altri in modalità differita sulla prima pagina. Quindi, combinare i file è buono quando capisci cosa combinare tutti. Come regola generale, se hai pochissimi file, allora non fa davvero una grande differenza.

alcune delle cose che si dovrebbe pensare prima di combinare i file JavaScript,

quando si combinano insieme 100 file. stai riducendo le 99 richieste. Ma stai anche facendo quanto segue:
* aumentando il tempo necessario per scaricare quel singolo file (e potrebbe bloccare il caricamento di una pagina importante)
* account per il tempo trascorso nell'analisi del codice JS aggiuntivo che abbiamo appena tirato dal server, quando potrebbe non essere nemmeno richiesto a questo punto.I motori javascript stanno diventando sempre più veloci, ma è ancora vero che una notevole quantità di tempo di è speso nell'analisi del codice javascript.

così, in breve la risposta è - "è sempre un gioco di trade-off e conoscendo il codice ben aiuta" :)

http://tomdale.net/2012/01/amd-is-not-the-answer/ è una lettura interessante su linee simili.