2

Recently I've made changes to an application which had 20 different .js files being referenced, to using bundling to bring this down to one file.

This includes:

  • Frameworks (jQuery library)
  • Custom logic (global logic for header navigation etc)

However after deployment this showed that we we're no longer making use of asynchronous downloading of javascript files.

Therefore our waterfall effect was replaced by one long download.

Has anyone ran into this problem before? Are there any guidelines for bundling which suggest multiple over single?

Curtis
  • 101,612
  • 66
  • 270
  • 352
  • 1
    How long was that download really? And wouldn't it be pretty much compensated for by use of the browser cache most of the time? Have any of the 20 files been served by a CDN before (and are not served by CDN now)? – Thilo Jan 28 '15 at 11:06
  • @Thilo That's exactly my scenario. I knew that coming directly from the server would add some impact, but I didn't think it would be the main contributor. – Curtis Feb 04 '15 at 09:19

1 Answers1

1

It depends on your application. Unless its a single page application I will prefer to separate the files into multiple js files based on functionality. If you have multi-page application instead of forcing client to download bulky large one file, separate them based on usage. Club together only those which are used by most of pages otherwise keep them separate based on functionality.

Mak
  • 596
  • 5
  • 10
  • I found the similar question but i think there are many answers you can use as reference. http://stackoverflow.com/questions/555696/put-javascript-in-one-js-file-or-break-it-out-into-multiple-js-files – Mak Jan 28 '15 at 11:13