I’m working on this page for a photographer. I wrote a jQuery script that flips through the images. I was originally replacing the src attribute but found that some browsers don’t update the image until the new src is fully loaded, so I ended up replacing the whole tag. However this still left the problem that images would reload if revisited, so I also append each image to a hidden div so they pop right back up.
After browsing a hundred images, this div is about 10 mB in size. Works fine on my own machine, but is there a point at which it’s prudent to empty this div? How much data should I be expecting a browser to store comfortably?
Don’t keep the image tags, instead just let the images stay in the browser cache as long as the browser things there is room for them. They will load from the cache instead of from the server when they are revisited.