Multiple Javascript files but only one HTTP request

Question

I want to separate my JS out nicely so each object is in its own file, I'll probably structure my directories and files like:

/js/modules/module1.js /js/pages/page1.js

Problem is I don't want to have like 50 HTTP requests for each file, is there a way to do this?

score 4 · Answer 1 · answered Aug 12 '12 at 03:52

This technique is quite basic and logical. The situation is that we have several calls to external Javascript files within our HTML’s header, which means several HTTP requests from the client’s browser. How do we approach reducing all these HTTP requests?

Combine them so that there is at least only one call to an external Javascript file, Avoid breaking any Javascript-dependent functionality on the web page, Minify the Javascript to save on bandwidth

http://falcon1986.wordpress.com/2010/01/11/combine-and-minify-javascript-reduce-number-of-http-requests/

+1 - You beat me to this, another link that is helpful is http://stackoverflow.com/a/15402/67566 — James Black, Aug 12 '12 at 03:53

score 1 · Answer 2 · answered Aug 12 '12 at 03:50

Two ways came to my mind:

Put only one js link in your site, like /scripts/all.js, and on the request for that js, compile and merge all files and serve them.
Use JavaScript dependency managers, to load scripts on-demand (rather than all of them, even if not used)

MayThrow · Accepted Answer · 2012-08-13T09:15:25.383

1

You can use a PHP file to serve all of them combined. This technique is used by many PHP softwares such as IP.board

In case of ASP.NET, this will help - http://abhijitjana.net/2011/10/06/bundling-and-minification-in-asp-net-4-5/

edited Aug 13 '12 at 09:15

answered Aug 12 '12 at 06:12

MayThrow

2,159
4
24
38

That would be aweosme, but unfortunately I'm using ASP.NET :( Which means I guess I'd have to compile the stuff before I can view the updated changes, which sucks! – williamsandonz Aug 12 '12 at 07:33
In that case, have a look at this - http://abhijitjana.net/2011/10/06/bundling-and-minification-in-asp-net-4-5/ – MayThrow Aug 12 '12 at 08:03
Can you change your original answer so others can see it mate? Thanks – williamsandonz Aug 13 '12 at 08:03

Multiple Javascript files but only one HTTP request

3 Answers3