dc.js / crossfilter 性能问题 12,000+ 行 CSV 数据

Question

我在使用 dc.js 和 crossfilter 时遇到了一些性能问题。我正在创建一组图表，显示一些自行车数据的不同维度（代码here，数据here，可查看here）。图表在几秒钟或两秒钟后呈现，但主要的性能问题发生在单击任何图表时 - 过渡动画在延迟后有点“快照”，有点刺耳。我还注意到，仅删除页面顶部的空折线图会导致其余三个图表在过渡恢复正常时表现得更好。

我查看了一些类似的问题，例如this one，但这似乎并不一定适用，因为我不是一次按多个维度进行拆分。 12,000 条记录是否刚刚接近 crossfilter 可以处理的上限？该文件只有大约 1.4 MB，因此在这种大小下会有问题似乎有点令人惊讶，但也许这一切都表明我缺乏理解。非常感谢任何关于这个的指针，因为我很难过。感谢阅读。

Answer 1

这通常意味着某些东西会减慢 Crossfilter 的更新速度，导致浏览器冻结，直到大部分转换已经完成。

唯一让我印象深刻的是，您在 dayOfWeek 维度的访问器函数中有 2 个变量声明。最好在加载数据时预先定义该属性。

我看到的唯一其他可能的问题是数据中的 Date 对象以及基于它定义的维度。这些类型的复杂对象会使事情变慢很多（并且 d3.js 日期解析不是非常快），但我不认为这是 Chrome 分析器中的一个主要问题，所以我不认为这就是让你在这里放慢速度的原因。