使用 Object.freeze 和 object.unfreeze 减少具有大量表数据行的反应性页面中的内存膨胀

Question

我正在使用此处给出的方法来减少具有大量表/行数据的 Vue.js 应用程序的内存膨胀。我们看到内存膨胀，尤其是在 IE 中。前任。加载页面时，具有几行的页面可以跳转约 100MB。

我发现，如果我冻结进入存储行数据的列表/数组中的每个对象，则膨胀会显着下降。100MB -> 60MB

对于我们在多个页面上有大量表数据的 Vue.js 应用程序来说，这是减少内存膨胀的最佳解决方案吗？我注意到，如果没有发生冻结，IE 在访问 2-3 个页面并进行 1-3 次搜索（每次搜索 50 行数据）后可以将内存跳转到 ~1GB！每次我们进行搜索时，我都会尝试清除数组，以便垃圾收集器进行清理，但它确实没有太大影响。

此外，当我们在数据表行中有一列需要动态更改（例如日期或名称）时，我应该 1. 取消对象的操作 2. 进行更改 3. 再次冻结它 4. 将其推回到数组

使用类似这个包的东西

Answer 1

这可能有点晚了，但您也可以在可变变量（let）中创建一个对象，并在需要重置时将原始对象重新分配给该变量。

例如：

let obj = { objProp: "example" };

if (condition) {
    Object.freeze(obj);
}
else {
    obj = { objProp: "example" };
}