大型数据集的过滤下拉菜单答案

【问题标题】：Filtering drop down for large data sets大型数据集的过滤下拉菜单
【发布时间】：2012-09-04 12:32:35
【问题描述】：

我正在尝试寻找一种能够处理大量数据（约 10,000 行）并创建一个组合框/下拉列表的方法或插件，该组合框/下拉列表可以通过键入进行过滤，或者能够滚动浏览一次所有记录。

我尝试过查看不同的插件以及编写自己的插件。有很多很棒的选项，但是一旦数据集变大，其中许多选项的性能会迅速下降。

我一直在玩chosen。但是，我担心的是当有 10,000 条记录时的搜索性能会导致输入延迟，并且如果您尝试输入速度过快可能会锁定浏览器。还检查了选择的 github 页面，它似乎最近没有太大的发展。

浏览器要求是 IE 7+（IE 确实是最大的问题，因为 javascript 性能不佳）和 FF（Chrome 和 Safari 是额外的）。

这是一个 jsfiddle，它在某种程度上模仿了将在我的案例中使用的数据类型。我还添加了所选插件，以便您查看它的性能。

【问题讨论】：

不是答案，但也许您需要重新考虑您的 UI。用户真的想要/需要查看 10K 项吗？你能把物品分成几组吗？然后当用户选择一个组时，使用 AJAX 填充第二个框。只是一个想法。
查看我对 KuH 回答的评论。对于这个特定的用例，它并没有很好地分解成组，因此需要过滤选项。我完全赞成通过不同的方式找到解决方案。
那么你可能会使用分页。用前 100 个左右填充列表。添加一个“下一页”按钮，单击该按钮时使用 Ajax 获取下一个 100 等。

【解决方案1】：

您可能想查看Datatables 作为替代方案。它真的很漂亮 - 你可以有一个很好的表格布局（你指的是“行”，所以我假设它是表格数据而不是单列）并且过滤是“智能/原子” - 例如如果您在搜索框中输入“red car”，它将为您提供包含 red AND car 的所有行，但不一定在一起。

它也有各种插件——包括一个使用滑块的分页器，对于大页数很有用。我已经用 2,000 多条记录运行它，只要你的 PC 有足够的 RAM，它就非常快。它支持通过 AJAX 进行动态分页作为替代方案。

它也实现了“无限滚动”，只需更改几个参数和一个或两个 AJAX 调用。

【讨论】：

实际上我的问题没有一个插件或方法。它更像是一种方法的组合来实现它。无限滚动和搜索的组合就是答案。数据表将是实现这一目标的一种方法。可悲的是，我被拉到优先级更高的项目上，所以我从来没有机会让它发挥作用。

【解决方案2】：

您确定将如此大量的数据加载到客户端并在那里进行处理是个好主意吗？像大多数开发人员通常做的那样——在服务器上，通过 ajax 处理输入并只加载需要的数据，这样做不是更好吗？

现在的 JS 更快，但没那么快。

【讨论】：