KnockoutJS在IE8中存在性能问题和内存泄漏

Question

我们使用 KnockoutJS 构建复杂的企业应用程序，在 IE8 中性能很差。 应用程序可能会占用超过1GB的内存，并且永远不会释放内存。 在调查过程中，我们发现 KnockoutJS 保留对 DOM 节点的引用并且从未删除它们。可以通过在任何公共 KnockoutJS 示例上使用 IESieve 来重现此问题，只需在添加和删除 DOM 节点时观察 DOM 利用率即可。

有人遇到这个问题并有任何解决方法吗？

- Maksym Shpak

---

我还没有遇到这个问题。也许是你的应用程序出了问题。 - Kyeotic

幸运的你，然而在 knockoutjs 论坛上也有不同的人在抱怨。你有针对 IE8 做什么特别的处理吗？ - Maksym Shpak

我不熟悉Knockoutjs，但熟悉基于IE的开发。如果Knockoutjs使用引用DOM的JavaScript闭包，则可能会导致悬空引用，从而降低性能并造成内存泄漏。为了解决这些问题，您很可能需要修改JavaScript库。 - Anthill

你解决了这个问题吗？你是否多次应用绑定？ - Rob Curtis

我在使用IE8时遇到了性能问题，这让我发现我的knockout代码——特别是一些自定义绑定处理程序——效率低下。其他浏览器也有同样的问题，但它们并不明显，因为其他浏览器的JS引擎速度弥补了糟糕的代码。 - Josh Schultz

Answer 1

我们在IE 8上使用knockout JS时遇到了类似的问题。其中一个问题区域是拥有一个observable数组(具有500个以上的元素)，并构建一个带有所有这些元素的UI(想象一下类似表格或列表的结构)。 唯一可行的解决方法是更改视图模型，使其仅包含适合屏幕的少量项目。此外，我们还必须添加滚动事件处理程序，以便observable数组可以始终保持更新。还有(不太引以为豪的是), 我们不得不在所显示的记录顶部添加一个空的div来产生视图已经滚动的假象。

- Ravi Y

---

你能分享一些相关的代码吗？我们也在寻找类似的东西。 - Rups

无法提供任何代码，但高级逻辑如下。将所有记录保存在JavaScript数组中，称为masterData。根据UI确定每次显示在页面上的记录数，称为pageSize。现在，在第一次加载时，从masterData仅添加pageSize数量的记录到VMs可观察数组中。还计算了总记录数的总呈现页面大小。现在是滚动部分。更多内容如下。 - Ravi Y

添加了一个页面的滚动处理程序，在其中根据滚动位置和Web页面的总高度计算当前索引。现在清空 VM 并从主数据中添加记录，从当前索引到当前索引+pageSize。在第一个渲染元素之前添加一个大小为 recordsize*current index 的空 div，以给出适当滚动的假象。希望这能帮助到您。 - Ravi Y

谢谢提供的信息。有没有关于类似按需加载这样的大数据加载的示例可用？如果我们将所有记录获取并存储在JavaScript数组中，它会影响客户端的内存。我们如何处理这种情况？ - Rups

Answer 2

可能与事件绑定有关，当它们的DOM元素被删除时没有被释放。如果这是发生在knockout内部的事情，您将不得不修补并提交一个pull请求。

我也经常遇到这种问题，使用backbonejs也是如此。JavascriptMVC在清理自己方面要好一些。

- Dom Barker

---

你在这里提到的是真的。问题在于事件绑定以及一些DOM引用没有被正确释放。 - Ravi Y