Post-loading : check if an image is in the browser cache

Question

Short version question : Is there navigator.mozIsLocallyAvailable equivalent function that works on all browsers, or an alternative?

Long ve

Answer 1

I have a remark about your empty image sources. You wrote:

So i render the page with empty image sources with the source specified in the "alt" attribute. I insert image sources after the "window.onload" event, and it works great.

I've ran into problems with this in the past, because in some browsers empty src attributes cause extra requests. Here's what they do (copied from Yahoo! performance rules, there's also a blog post on that issue with more detail):

• Internet Explorer makes a request to the directory in which the page is located.
• Safari and Chrome make a request to the actual page itself.
• Firefox 3 and earlier versions behave the same as Safari and Chrome, but version 3.5 addressed this issue[bug 444931] and no longer sends a request.
• Opera does not do anything when an empty image src is encountered.

We also use a lot of jQuery on our site, and it has not always been possible to avoid empty image tags. I've chosen to use a 1x1 px transparent gif like so: src="t.gif" for images that I only insert after pageload. It is very small and gets cached by the browser. This has worked very well for us.

Cheers, Oliver