Web components and iframes are not mutually exclusive. Web components off ease of use and page styles and events integration, iframes offer a much stronger encapsulation boundary. You can use a web component to host and load an iframe even.
A few advantages of web components if you don't need the security boundary of iframes:
- Web components can naturally resize to their content where iframes can't.
- Some page styles inherit, like `color`, `font-family` and all CSS custom properties, so they can look more integrated.
- Web components can fire events.
- Web components can have slots to project content from the use site into.
- Web components are much lighter weight than iframes.
That's true. I think I still like the limits of an iframe as a design constraint, compared to web components where you have to explicitly make those decisions. But really what tips me into iframe land is when using a backend for the HTML page can unlock something you can't do otherwise.
Comments
Web components and iframes are not mutually exclusive. Web components off ease of use and page styles and events integration, iframes offer a much stronger encapsulation boundary. You can use a web component to host and load an iframe even.
A few advantages of web components if you don't need the security boundary of iframes: - Web components can naturally resize to their content where iframes can't. - Some page styles inherit, like `color`, `font-family` and all CSS custom properties, so they can look more integrated. - Web components can fire events. - Web components can have slots to project content from the use site into. - Web components are much lighter weight than iframes.
Great points! We've talked about using iframes when we specifically don't want people to customize things, like single-video embeds.
You can set the CSS properties that you don't want to inherit, you shouldn't need an iframe.
That's true. I think I still like the limits of an iframe as a design constraint, compared to web components where you have to explicitly make those decisions. But really what tips me into iframe land is when using a backend for the HTML page can unlock something you can't do otherwise.