I have read that combining all of your css files into one big one, or all of your script files into a single script file reduces the number of HTTP requests and therefore speeds up download speed.
But I don’t understand this. I thought that if you had multiple files (up to a limit, which is 10 I believe on modern browsers), the browser would download them in parallel, thus REDUCING the total time to download (divided by the number of connections allowed).
I am obviously missing a key piece of info here. Can someone turn on the lights?
There’s overhead in every request/response. That’s essentially what it comes down to.
Here’s an example of a request header to Google …
I wrote an article about this last year…
http://swortham.blogspot.com/2010/03/latency-requests-css-sprites-and-you.html
You are right that multiple files can be downloaded in parallel (2 or more from a single hostname, depending on the browser). And that in turn will cause the page to load progressively, which is good. But that doesn’t mean that your homepage should be composed of 20+ css, js, and image files. Ideally you’d want to combine quite a bit to optimize the site.