Are Iframes Considered 'Bad Practice'

Are iframes considered 'bad practice'?

As with all technologies, it has its ups and downs. If you are using an iframe to get around a properly developed site, then of course it is bad practice. However sometimes an iframe is acceptable.

One of the main problems with an iframe has to do with bookmarks and navigation. If you are using it to simply embed a page inside your content, I think that is fine. That is what an iframe is for.

However I've seen iframes abused as well. It should never be used as an integral part of your site, but as a piece of content within a site.

Usually, if you can do it without an iframe, that is a better option. I'm sure others here may have more information or more specific examples, it all comes down to the problem you are trying to solve.

With that said, if you are limited to HTML and have no access to a backend like PHP or ASP.NET etc, sometimes an iframe is your only option.

Is it bad practice to use iframes? Can iframes be translated into images in the same way canvases can?

However, iframes are not obsolete, but they are frames. Is it considered bad practice to use them?

Sometimes you have to embed a separate HTML document into another, and that is OK. For the record, HTML5 has an entire section dedicated to embedding external content, of which one of the relevant elements is iframe (W3C HTML5).

Of course, whether something is good or bad practice also highly dependent on your use case, but best-practice questions tend to be quite broad by nature.

Also, can iframes be rendered to data:png/base64 or whatever, in the same way canvases can?

As a matter of fact, yes, although IE does not appear to support data:text/html at the moment:

<iframe src="data:text/html,<!DOCTYPE html><html><body><p>abc"></iframe>

However, this is not the "proper" way to do it (even the validators don't agree on whether the syntax is valid — W3C's Nu validator appears to dislike data:text/html because of all the HTML symbols, while Validator.nu only complains about the unencoded whitespace in the DOCTYPE). For embedding raw HTML, you need to use the new srcdoc attribute instead of src (which has even less browser support):

<iframe srcdoc="<!DOCTYPE html><html><body><p>abc"></iframe>

So, in general, specifying raw HTML for iframes is a bad idea for now, and even once browsers start supporting the srcdoc attribute, you should use that over a data URI with the src attribute.

Is iframe bad practice?

Yeah, this is one of those cases where it's not a "yes or no" type answer. Nowadays there is a lot you can accomplish using AJAX to load HTML from the server and have it populate a div for you - heck jquery's even got it built into their AJAX functions.

I normally try to figure out if that's a good solution for the problem before resorting to iframes. Sometimes, however, an iframe just does the job better. It maintains its own browser history, helps you segregate CSS styles if that's an issue with the content you're loading in.

I like j08691's comment that it's a "necessary evil" sometimes, but don't let that stop you from using it when the AJAX/Div solution just gets too damn ugly or requires too many hacks to get working.

Why are iframes considered dangerous and a security risk?

As soon as you're displaying content from another domain, you're basically trusting that domain not to serve-up malware.

There's nothing wrong with iframes per se. If you control the content of the iframe, they're perfectly safe.

Why developers hate iframes?

Iframes can have similar issues as frames and inconsiderate use of XMLHttpRequest: They break the one-document-per-URL paradigm, which is essential for the proper functioning of the web (think bookmarks, deep-links, search engines, ...).

If you're creating a web application, use whatever technique you want to (including frames, flash, applets, $whatever). If you're creating an actual, informational web page, stick to frameless HTML, CSS and unobstrusive JavaScripts and keep in mind that the page should still be usable with scripting disabled.

iFrames bad or good?

iframes are not evil.

They're not very well thought of, that's true, but they're not evil either. They can be misused but what technology can't?

You can send data between iframes and your own webapp with a bit of JavaScript. I think window.parent is what you're looking for.

Reasons for not using IFrame?

The iframe is a great tool. It enjoys near-universal browser support, it's easy to implement and has a number of useful functions. As with any other HTML element, it can be abused, but wielded intelligently it can play a part in a solid UI.

Some developers might argue to use AJAX instead, and in some situations that may be the more appropriate approach, but AJAX is not a panacea and iframes can be a far simpler implementation which has the same end-result for your users. Do whatever is simplest first, and only change that when you can verify how and why that is not working.

Is calling React Web App by Iframe a good practice?

Barring some other reason to do so, no, you would not want to do this.

The React devtools still work just fine, you just need to load the iFrame independently.
If exposing your compiled React app is a security concern you've done something wrong.
The contents of your iFrame are still available just like any other page.
An iFrame is not “an expensive call” — it's an HTML element that instructs a browser to render content from another resource. The overhead associated with an iFrame is higher than embedding content directly, but whether or not it's excessive or justified depends on the situation.

Are Iframes Considered 'Bad Practice'