在 extjs 7.5.1 中,所有网格面板都是“无限滚动”的,并且有插件https://docs.sencha.com/extjs/7.5.1/classic/Ext.grid.plugin.BufferedRenderer.html
“(...)用户滚动浏览数千条记录,而不会一次将所有记录呈现到 DOM 中的性能损失。(...)它会自动实例化并应用于所有网格”
我正在努力将应用程序从旧版本迁移到 extjs 7。它在源 extjs 4 版本中按预期工作(行数相同~80k)。第一步是删除显式创建,因为它不应该再直接使用了。
这是供框架内部使用的私有实用程序类。不要依赖它的存在。
尝试解决问题的最佳方法是什么?
在浏览器DevTools中:
grid.bufferedRenderer.isBufferedRenderer
grid.bufferedRenderer.isPlugin
grid.bufferedRenderer.disabled
grid.bufferedRenderer.id
最后一个可能看起来很可疑......但是如果我执行 getId() 而不是它会从那时起获得生成的 Id。
鉴于我时间不够,我无法重现代码示例,也不允许我分享真实代码。
我有一个之前的应用程序(extjs4)和一个之后的(extjs7)。所以我们为新版本迁移了 extjs 的版本并修复了很多损坏的功能,其中大部分都有一个明确的错误,我们可以跟踪错误到代码中的某个位置(在 extjs 框架代码中很多次,因为它会在那里显现出来)。
内存快照显示 4GB 的内存主要在 DOM 对象中,因此 BufferredRenderer 没有完成它的工作。
我检查了代码,寻找可能与新版本的 extjs 发生冲突的可疑覆盖或配置。我已经并将尝试调试代码,但由于问题出现在代码的 extjs 端,我花了很多时间来尝试弄清楚发生了什么,但进展甚微。也许我会尝试存根数据以快速迭代修复行的数量但足够大以检查 Dom 的优化,希望 200 行就足够了。
我们仍在努力了解到底发生了什么,但我们找到了一个有效的解决方法:为每次搜索创建或绑定一个新商店。
我使用辅助静态数据文件在我的应用程序之外复制了这个问题。我们正在使用 extsj 7.5.1,如果我有空闲时间(不太可能),我会尝试制作小提琴。
如果我使用 grid.bindStore(store) 进行动态绑定,它会有效地显示大量行;如果我使用 Ext.grid.Panel 存储配置,它不会并因内存不足异常而爆炸。怀疑与缓冲渲染器错误有关。不确定。