Consider the following html page, which can load in many large png files:
<html>
<head>
<script type="text/javascript">
function hide( )
{ document.getElementById("here").innerHTML = "hidden";
}
function show( )
{ var loadMe = "";
for (var i=1; i<250; i++)
{ loadMe += "<img src='http://domain.com/" + i + "_a.png'><br>";
loadMe += "<img src='http://domain.com/" + i + "_b.png'><br>";
}
document.getElementById("here").innerHTML = loadMe;
}
</script>
</head>
<body>
<a href="javascript:hide();">hide</a>
<a href="javascript:show();">show</a>
<div id="here"></div>
</body>
</html>
In IE, Safari & Opera on a windows machine, the images on this page are only loaded once (monitored with FreeMeter) when the show and hide buttons are toggled.
However, in Firefox (freshly installed), some images are loaded from the server multiple times (we never match the initial peak in network requests... a few things are loaded from the cache).
The response headers of the images read:
Date Wed, 18 Mar 2009 11:42:02 GMT
Server Apache/2.2.3 (Red Hat)
Last-Modified Mon, 27 Oct 2008 19:19:47 GMT
Etag "1abb7d7-292-45a41039f7ac0"
Accept-Ranges bytes
Content-Length 658
Cache-Control max-age=7257600
Expires Thu, 15 Apr 2010 20:00:00 GMT
Connection close
Content-Type image/png
Looking into about:cache, most of the images loaded appear to be listed there (although inspecting the cache between hide/show clicks, there appears to be missing images):
Number of entries: 462
Maximum storage size: 50000 KiB
Storage in use: 5593 KiB
...
Key: http://domain.com/23_a.png
Data size: 16139 bytes
Fetch count: 13
Last modified: 2009-03-18 07:40:14
Expires: 2009-06-10 07:40:00
What's firefox expecting from me to reload these images from the cache so we can go easy on the network calls? Thank you!
Update
If I open this page in a new tab after showing / hiding in the first tab, the second tab makes no network requests. The first tab continues to make network requests.