Background: I prefer to keep all my CSS and Javascript in separate .css/.js files. (Reason is that they are shared by many pages so in this way, static data in those file would not get transferred with each page view). This leads to some pages having 5-6 “link rel” or “script type” statements.
Now, normally, this would mean that browser would make separate request for each of those css/js files, and effective page load time can increase – say become 5X for 5 round trip requests (please correct me if I am wrong here).
My question is:
1) Do modern browsers request keep-alive connections by default?
2) If they do, then does it mean that additional file sourcing (css/js) will not increase the effective load time? For example – will the server assume that browser is going to request the css/js files, and hence keep sending it (thus avoiding an extra request)?
In short – can anyone explain when would the load time NOT increase by having separate css/js files and if it always increases, then is the load time increase proportional to the number of files included?
regards,
JP
Yes, browsers using HTTP/1.1 should generally be using keep-alive connections.
The server won’t necessarily assume it; the keep-alive should mean there isn’t a separate DNS lookup – the file still gets requested.
If properly configured, you should find (which can be verified with Firefox+Firebug for example) that the first request generates a normal download of those files, but subsequent requests generate HTTP 304 (File Not Modified) requests where the content has not changed since the last load and as such it should be available from cache.
If it is a real concern, you may want to look into using Expires headers to specify long-life of the files, so the request never even gets made (not even the request to see if the file has changed)