如何使 Qooxdoo 虚拟列表可扩展？答案

【问题标题】：How can I make Qooxdoo virtual list scalable?如何使 Qooxdoo 虚拟列表可扩展？
【发布时间】：2014-06-18 20:16:59
【问题描述】：

我需要显示数据列表，至少 100 万行（大数据，机器学习）。我不需要立即显示，qooxdoo 表的 remotetablemodel 工作正常，但我选择列表而不是表作为设计选择。

下面是我做的一个测试。

//create the model data, 1mil items
var rawData = [];
for (var i = 0; i < 1000000; i++) {
 rawData[i] = "Item No " + i;
}
var model = new qx.data.Array(rawData);

//create the list
var list = new qx.ui.list.List(model);
this.getRoot().add(list);

我理解生成原始数据并将其分配给列表需要很长时间。但问题是分配列表后，虚拟列表本身几乎没有响应。

滚动很慢，向下箭头导航也会冻结几秒钟。如果我理解正确，Qooxdoo 虚拟基础设施应该只呈现可见项目？但是在上面的测试用例中它是如此缓慢。我希望像远程表模型一样工作。

在 Chrome 35 stable 上使用 qooxdoo 最新 4.0.0 和 3.5.1 测试。

【问题讨论】：

标签： javascript html performance scalability qooxdoo

【解决方案1】：

我只能使用源版本而不是构建版本来重现您的问题。我找到了性能如此缓慢的原因。 SingleValueBinding 的内部方法中有一个运行时检查，这对渲染的性能影响很大。

我为此打开了一个错误报告： http://bugzilla.qooxdoo.org/show_bug.cgi?id=8439

但我很伤心，这个问题只发生在您的开发者版本中。所以你的客户不会受到影响。

您可以根据需要禁用检查。只需删除检查块： https://github.com/qooxdoo/qooxdoo/blob/master/framework/source/class/qx/data/SingleValueBinding.js#L915

您还可以分部分加载模型数据以改进模型创建。当用户滚动到列表末尾时，您可能会加载下一部分。您可以使用您已经看过的示例： Infinite scroll in qooxdoo with virtual list

【讨论】：

非常感谢，我将测试您提供的列表版本。
所以我现在的理解是，要能够处理庞大的数据集，数据绑定并不理想。只是手动放数据会更好，对吧？
是的，应该可以处理庞大的数据集。您必须对虚拟列表使用数据绑定，但我很遗憾源版本中只有一个性能错误。