A good method for client-side iframe caching

Question

I'm trying to cache some documents client-side in order to switch between them faster.

The documents have been loaded in an iframe, so it's a question on how to cache it locally within the browser.

My method was to have a variable, item, and then do

if (item.cache) {
    $('.holder', someElem).html(item.cache);
    return;
}

item.cache = $('<iframe....');
$('.holder', someElem).html(item.cache);

However, this method keeps reloading the iframe src, when injected on to the holder.

Any good methods for client-side iframe caching?

Answer 1

The iframe doesn't actually trigger a page refresh until it has been added to the dom. I am guessing you keep an instance of the iframe but not add it to the dom until its time to see it. This method doesn't work well. I would suggest using css "display:none" to load it and hide and then show it when you need it.