views:

452

answers:

3

Is it possible Firebug may be incorrectly adding downloads to the Net tab when things may be loaded from the cache?

I have some code in a Javascript gallery which is meant to lazily download an image when the thumbnail is clicked and then display it once downloaded. It is meant to determine if it's been downloaded already first (via an array with Boolean values), and if it has been downloaded before, simply display from cache.

I thought it was working fine for a while (because of the speed at which they would appear when clicked twice), but I recently looked into Firebug's Net tab and it seems to be downloading the large image every time (and the total file size gets bigger with every click).

I'm not sure what I have done wrong as a bit of debugging has informed me the Boolean values are being updated correctly.

The site is at: http://www.stationhotels.com.au/?page=bar-and-dining

So my question is, could Firebug be incorrect (I doubt it), or is there any way I can force it to display from cache (I thought using the exact same path to the image for the image.src would do this)

This was my first venture into objects in Javascript so I'm not 100% confident about my code so please be kind!

Thanks in advance.

+3  A: 

Firebug might not be 100% correct, or at least, that might not be exactly what would be happening if Firebug was turned off.

I would try using Fiddler or maybe WireShark to check the network activity, see if it looks any different. Fiddler is a debugging proxy for IE, WireShark is a packet sniffer.

I can't say exactly how Firebug net monitor works, because I've never dived under the hood, but I have experienced a few things which I thought were bugs of my doing, which went away when Firebug was turned off.

It seems that Firebug in the act of measuring things, alters things in a "looking at your quantum cat" kind of a way. Firebug still rocks, but it does have some limitations.

seanb
+4  A: 

The image appearing in the net tab in firebug does not mean it is downloaded from the server. Check the HTTP response code that firebug reports for the image - for me after one visit, it kept returning "304 - Not Modified" which means it is being loaded from the cache.

You can avoid the extra HTTP request that checks if the cache is still fresh by sendingfar-future headers for components you want to cache hard. Bear in mind though, that in order to force the client to re-download a component that was cached this way you'll have to change the filename.

Eran Galperin
Thanks! I totally skipped over that!
alex
Mine is still coming back with 200 OK
alex
Check your cache setting in firefox - make sure you have the checkbox checked and enough space allocated
Eran Galperin
Thanks Eran.. I had accidentally left 'Disable cache' on under Web Developer toolbar... how silly of me!
alex
+1  A: 

I checked your site and using CacheViewer confirmed that it is indeed caching it and fetching it from disk, with an expiration one month from today. If you want you could also use plsicing by combining all the images into one large image and only show the area of interest, although I typically use splicing for small images, like paging icons, etc. ANyway, your site looks great and like the way you delay loading the large images.

Thanks for the kind words and answer!
alex