I've just completed more tests. In locations close to the origin server (east cost), the improvement of load time seems to average 50 - 100 ms. In the rest of the world (west coast included), it's about 100 - 200 ms, more in some cases.
I'm quite happy! :-)
Pat, I'm actually using Dnsmadeeasy, and I'm not sure why occasionally the DNS look up times have been so slow.
Was that something that you manually did or something automatic that's been done? Our site is an ecommerce site and every page has 50 product thumbnails by default (can go up to 500 if the user chooses to). I'd like to do spriting like you have there, except for we have a dedicated in-house photography studio that does hundreds of new photos a day. So such a solution would have to be automatic, not just because of the amount of new images, but the scope of our catalog as well (over 20,000 sku's). If your solution isn't automatic, have any ideas?
p.s. Congratulations, i'm quite impressed with the speed of your site.
p.s.2. Would like to clarify that we currently do use spriting, just not on the product thumbnail level. Since the majority of our http requests are from those though, that is probably the next best place for me to focus my attention.
Thanks, Jarrod. Unfortunately it was done manually. It's a good enough solution for my site, but obviously not a solution for your site. My site talks about a limited number of software products, so the pictures are in most cases good for next year, too. Just the version number in the description changes, plus the review is updated.
Not that I'm aware of. Looks like Google Image Search uses a similar technique. Regardless of how you go about it, there is going to have to be some trade-offs for cacheability (when you combine multiple files together then it's that specific combination that you are caching). For category pages this shouldn't be a problem but there's probably a long tail of images for search.
Hand-waving the caching issue for now, the flow would basically look like this:
- detect that the browser can support data URI's (on the server probably)
- instead of src tags on the images, put an id on the img tag (or a div where the image will be placed inside of)
- when the json response for each comes back, dynamically insert the src tag on the image elements with the data URI for the image
Now the "worst" performing thing is the DNS. Sometimes the first test shows the DNS time multiple times longer than the subsequent tests. But there's very little I can do about it short of looking for a different CDN provider. My CDN provider keeps the TTL time very short, I don't remember now exactly what it is, but if I recall right, the last time I checked it was like 20 minutes or something. I'm not sure if that's typical of CDNs to keep it this short.