I wonder why we should combine Javascript and CSS Files, because it’s only an advantage on the first page load. On all followed requests JS/CSS is loaded from clients browser cache. It then should make no performance differences, or am i totally wrong?
-
I think you're thinking the opposite. On the first page load, the browser has to request every single resource. On every following request, the browser (can) uses the cached resource instead of fetching it from the server, resulting in less overhead. Is that what you're asking about, or am I totally wrong?Ian– Ian2012-12-05 15:32:44 +00:00Commented Dec 5, 2012 at 15:32
-
2If I'm not mistaken, the browser still files a request to see if the server has a newer version of the file than the one it's cached.Sandy Gifford– Sandy Gifford2012-12-05 15:34:54 +00:00Commented Dec 5, 2012 at 15:34
-
2The first impression is quite important though. If your site loads for ages the first time, the user might turn it off before it completely loads.kapa– kapa2012-12-05 15:37:15 +00:00Commented Dec 5, 2012 at 15:37
-
The CSS/JS is also not cached forever, I'm not sure on specifics but I'm guessing everytime a users browser closes? (or something similar)Sean– Sean2012-12-05 15:39:22 +00:00Commented Dec 5, 2012 at 15:39
-
1But I think there are simpler ways of increasing performance than reducing JS/CSS files (unless you have, say over 5, all of significant size)Sean– Sean2012-12-05 15:40:30 +00:00Commented Dec 5, 2012 at 15:40
Add a comment
|
1 Answer
There are a few reasons:
- Browsers typically have limits on how many HTTP requests they can make to a given site at the same time (out of politeness, more than out of any true technical limit), and you don't necessarily want scriptC.js and Z.css holding up scriptA.js and A.css;
- Every individual HTTP request has overheads in latency and bandwidth, even if it's a 'conditional GET' which results in a '304 - not modified' response;
- Caches do get invalidated from time to time. In HTTP, the exact time for expiry is usually set by the server in the headers of the HTTP response. The problem is, the server never knows for sure exactly how long it will be until an update will be published, so it is constantly hedging its bets and giving a 'short enough' expiry date. (Using unique generated names for resources included by an HTML file is one way of dodging this bullet ... only the enclosing HTML page needs to be checked.
There is a small reason to have 2 scripts:
- You can have one script that starts executing ASAP, while the big script loads.
But yeah, it's all about end-user-perceived speed ... especially on the first page load, when you're trying to win their attention.
