how to prefetch / cache iframe content?

Question

i have a iframe and it takes a while for for the content to come back. I can't avoid using the iframe, so i'm wondering if i can somehow:

1. cache the content, so that when i revisit the page, it loads very fast.
2. prefetch the page that has the iframe on it. Here I've tried using <link rel="prefetch" href="..." />, but it seems that it has no effect on the iframe

any ideas how to solve this issue? Can be a front end or a back end solution?

Answer 1

Loading the iframe content makes the browser cache the page in it, so that if you load it a second time later, the browser will simply fetch it from cache, unless your server is set up to always load the content afresh. I suspect that if you're seeing it reload the iframe's page each time you revisit it, you either forgot to indicate how long the page should be cached for, or your server isn't set up to say "this page has not been modified since ..." so the browser doesn't try to reload the page, or the page is served with a header that indicates it cannot be cached.

(If you want to preload the content for the first run, that's the same thing as loading it in the iframe, with the iframe hidden, and then showing it when the iframe content is ready.)