javascript - 使用iframe嵌入有哪些陷阱

Question

我正在尝试使用 Elm 构建一个可重用的类似仪表板的 UI，以便通过 yaml 文件进行声明式配置。

yaml 文件将指定一组可嵌入的 Web 应用程序(不仅基于 elm，而且理想情况下还包括 React/Angular/Vue)，以包含在此 UI 的每个实例中，例如通过指定标签和存储库 URL。

我尝试过使用传统的 Elm/React 方式来接管标准的非 iframe dom 元素，但存在各种问题。 (主要是elm替换了它接管的元素，意味着各个应用程序不能共享同一个容器)

如果您愿意，您可以在此处查看完整的概念证明 https://github.com/Dansvidania/mondrian-elm

还有更好的方法吗？ (我确信有)但是，如果我决定使用 iframe，我可能会遇到哪些问题？我只找到了反对 iframe 的轶事证据，并且(特别是对于沙箱)它们似乎很理想。

提前致谢

Answer 1

来自Cam Jackson's Micro Frontends artice on martinfowler.com

Just as with the server-side includes option, building a page out of iframes is not a new technique and perhaps does not seem that exciting. But if we revisit the chief benefits of micro frontends listed earlier, iframes mostly fit the bill, as long as we're careful about how we slice up the application and structure our teams.

We often see a lot of reluctance to choose iframes. While some of that reluctance does seem to be driven by a gut feel that iframes are a bit “yuck”, there are some good reasons that people avoid them. The easy isolation mentioned above does tend to make them less flexible than other options. It can be difficult to build integrations between different parts of the application, so they make routing, history, and deep-linking more complicated, and they present some extra challenges to making your page fully responsive.