14

I'm working on a web-application that loads a couple of small gif images onto the screen. I'm using a relative path, which means they are loaded from the same web server that serves the php page. The operation is instantaneous, and I'm on a different continent than the web server.

I just tested a CDN network for this (Cloudfront), thinking that moving static files closer to the user is a great idea. However, all of these files now take a half second or so to be rendered on the screen. I now have to use a absolute path, of course (https://xyzvf.cloufront.net/images/)

Why is that? Is the absolute path a problem? I'm reducing the HTTP requests to my own server which is a good thing, but that delay is annoying. Isn't CDN suited for this?

3
  • 4
    It pretty much depends on where the CDN is located. If you have many small images, is combining them into a sprite an option? That would mean only a single request to load all images.
    – alexn
    Jul 22, 2011 at 9:09
  • They have these locations: michaelgaigg.com/blog/images/amazon-cloudfront.jpg I'm in Europe, and loading the images from my web server in US is faster than loading from germany or whatever europe location amazon serves me from. Or maybe not the loading time is the problem but something else? Using a sprite is a great idea thanks.
    – Dan
    Jul 22, 2011 at 9:18
  • You could use also use a protocol-less URL with the host name, like "//xyzf.cloudfront.net/images". This allows you to take advantage of ISP and corporate proxy caches for caching non-SSL versions of the images. This can have a tremendous benefit for both your visitor experience and server/bandwidth load. Our site's visitors are almost all from US-based financial institutions, and we detect about 85% visit from behind some form of caching proxy. YMMV, so test your own site and traffic of course.
    – rmalayter
    Aug 2, 2011 at 15:38

1 Answer 1

6

An issue might be DNS or keep-alive -- that is, the browser already has the IP address for your server and has a connection open to it, whereas it has to resolve the CDN's server's name and then open a new connection there, and one of those or both constitute the delay you're seeing.

Spriting, although still a good idea, wouldn't help those problems. Indeed, no solution comes to mind. The only comfort is that half-second delay wouldn't get much longer if you had a thousand images (and CSS files and JS files and whatever other static files you needed) and wouldn't put any more stress on your origin server if a thousand more users hit it.

2
  • This rings a bell. I should mention that the first call to the CDN server is made when the first image is needed, like in the middle of the page.
    – Dan
    Jul 22, 2011 at 9:43
  • Ah, then you may get better (perceived) performance if you made a reference, any reference, to the CDN very early in the page. The best way might be to put your CSS files on the CDN and put the link tags in the head section, so the connection process will get started right away.
    – Malvolio
    Jul 22, 2011 at 14:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.