First, broadband connections get faster every day!
Second, you can minimize http-requests by simply put your js and css into your html file using ASP, PHP, RUBY etc. That minimizes the http-requests to 1 + n, where n is the number of images you need in your design.
Why on earth would you want to do this? Separating behaviour and style is GOOD, thowing them in with each other is BAD. This is a hack, to allow you to do something that nobody should be trying to do in the first place.
Comment by JoeBoy — May 2, 2007
An interesting approach. I do wonder about the time required to send out those extra <– characters, as opposed to the latency of two separate HTTP requests. The latter might just be faster.
“two separate HTTP requests”
If the webserver supports Keep-Alive, it can happen (depends on browser behavior), that all the objects on the page will be downloaded in one single HTTP connection.
Comment by Magyusz — May 3, 2007
Just gzip the stuff, set an expire header so the browser never asks for a file a second time, and use versioned paths. Done. No hacking around
Comment by Martin Bialasinski — May 3, 2007
Good to see my blog being discussed here… I implemented this technique keeping in mind the non US customers, especially people from fareast countries like India and China for whom saving even a single request (especially a blocking request like JS, CSS) adds a good value. It did give noticeable improvement for our pages.
This technique is not for all – if you are a person loosing your night sleep thinking about improving your webpage load time then you would want to use this – others please don’t bother.
To answer the people who say to put the css and js inline, this prevents caching across pages. If you had one include file containing css and js and it was the same for all pages, it would stay cached for the entire visit.
Limiting the number of http requests is a good idea for very busy sites. Having been slashdotted recently, I know that servers can only handle a certain number of simultaneous http requests. If you have 9 graphics on your home page, a css file, a js file and the page itself, that’s a total of 12 http requests. Removing one of these hits theoretically increases your server capacity by over 8% which.
Will I use this technique, probably not. But if I do think its remarkably clever and would be fun to play with.
Along these same lines, one of my co-workers found that you can base64 encode an image and embed it right in the page. :-) <img src=”data:image/png;base64,iVBORw0KGgoAAAA…”
Ok, the reason for reducing requests is not because people are “dumb” or should go back to inline styles. The issue is that as broadband speeds increase protocol overhead becomes more of an issue than download size. So reducing requests can really improve performance. Most people with large sites have elaborate build processes that allow keeping css, js, html all separated for ease of development (keeping functional pieces seperate, which we all know is a best practice). So during build time we can assemble the files however we like. If every page in a site uses the same JS and CSS file, it would make sense to serve the both together. The mime-type issue makes this a non-starter, but it would be nice. In general, I like to keep it down to three requests outside of images. On home pages I embed all the js and css in the page, because most users don’t make it past the home page so they should get the fastest load time possible, then inner pages separate to allow deep users of the site to take advantage of caching.
Comment by Stephen — May 14, 2007
ASP.Net has a concurrent connection limit of 2 per session, therefore if more than 2 requests hit the server at the same time, only the first two requests are processed, the others a queued.
Therefore rather than â€œhackingâ€ resource files together and taking internet development back 10 years, why not increase the concurrent connection limit in your web.config.
Obviously a little common sense is needed when setting this value; you need to take into account server hardware, traffic and bandwidth etc.
Also, your local IIS (localhost) has no connection limits so you will only notice performance benefits on a production server (Unless youâ€™re running 2003 as your desktop).