Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

Another advantage of using an iframe (besides cross-domain communication) is that you don't have to reset every CSS style you need. When you insert JavaScript into a page it inherits all the crazy CSS already on the page which can cause all sorts of problems. Iframes have their own context and give you an easy way to avoid that problem.


Although one major disadvantage I've discovered recently is that if you embed an iframe (with a no-cache response header, i.e. Facebook's like button) it stops Firefox adding the page to the back-forward cache. Same with Webkit if the protocols don't match. https://developer.mozilla.org/en/using_firefox_1.5_caching

I wonder how much extra bandwidth Facebook has wasted worldwide by doing this? Twitter allows caching for 30 mins at least, good enough for back/forward caching to be useful.


Yup.

Interesting tidbit: HTML5 suggests the `seamless` attribute for <iframe> elements, which would cause those CSS styles to actually affect the contents of the <iframe> (and some other changes, like links affecting the location of the parent window). http://www.w3.org/TR/html5/the-iframe-element.html#the-ifram...

(Of course, you meant to say “when you insert typical content DOM nodes”, not “insert Javascript”.)


that is what I meant to say. thanks for clarifying.


Related: if you're only using the iframe for the CSS reset, you can also just document.write its contents, so the client doesn't need to do a separate request and the iframe is on the same origin as its parent frame. Example: https://github.com/cappuccino/cappuccino/blob/master/AppKit/...


An iframe also helps in IE6 (can't directly remember if it's also in IE7) to draw overlays over form elements, otherwise they will be on top.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: