iFrame - 在 Web 应用程序中实现 iframe 的成本

Question

首先，澄清一下，这个问题与加载页面渲染性能无关。

我正在开发一个使用 SVG 和大量 javascript 的 Web 应用程序（HTML5、SVG、CSS3 和 Js）。它达到了拖动明显缓慢的地步，我们不得不返回并重新编写和审查所有现有功能以优化应用程序。

我的一个队友认为，如果我在 iframe 中加载功能，Web 应用程序不会产生太大影响，因为浏览器会在单独的线程中处理它，因此现有的 Web 应用程序选项卡不必承担iframe 内容渲染和更新首当其冲。另外，如果需要，iframe 中的内容可以轻松呈现在 div 中。

我的问题是，浏览器（当然是最新的和最好的）在处理 iframe 时是否会为渲染和性能分配单独的资源？应用程序加载不是这个问题的问题。

Answer 1

我不想在这里跳入旧线程，但公认的答案具有误导性。您的朋友是对的：iframe 被有效地沙盒化，因此它们的渲染过程在现代浏览器中是独立的、异步的和多线程的。因此，虽然将应用程序的部分分割成 iframe 不会加速任何 javascript 的执行，但它很可能会提高 渲染 性能，以达到分割和简化每个页面组件的 DOM 的程度。

作为参考，请查看 the story about Fastbook，这是 Sencha 工程师在几个星期内将其作为一个晚上的项目组合在一起的，只是为了表明 Facebook 网络应用程序可以得到极大的优化。除此之外，他们还使用 iframe 进行沙盒渲染。

顺便说一句，这并不是浏览器应该如何工作的。 （例如，Chrome 团队鼓励人们在需要 iframe 来提高性能的情况下提交错误。）不过，在可预见的未来，它是复杂应用程序的最佳实践，尤其是那些具有多个“面板”和高回流率的应用程序。

Answer 2

同域<iframe>s 保证在同一个线程中运行。

如果不能相互交互，浏览器只能在不同线程上运行两个页面。