使用大型(70,000 多个项目)数据集进行高效 jQuery 实时搜索
Efficient jQuery live search with large (70,000+ item) data set
我正在为我的 WordPress 网站上的一个页面创建一个新表单,我想在此表单的其中一个输入中添加一个使用 jQuery 的实时搜索功能,该功能列出了可能的选项关于用户到目前为止输入的内容。我过滤的数据集是一个非常大的 JSON 对象,存储在我的主题中,包含超过 70,000 key/value 对。因为我目前在每个 keyup 上循环遍历整个对象,所以我实现的实时搜索非常慢并且经常冻结。
使用 jQuery 对大型数据集执行实时搜索的最有效方法是什么?
jQuery 用于 DOM 操作,在这里不会有用。
JavaScript 可以解决这个问题,但是,随着您服务的数据的增加,它也将变得越来越明显,它应该可以通过缓存内存或数据库中的服务器访问。
JSON 的大小可能会影响页面加载速度,对于某些可用内存较小的设备,可能根本无法加载页面。
除此之外,您需要做的是在键中构建一个查找结构。这种设计模式称为"trie"。如果没有任何示例代码可以继续,为了示例而在这里实现将是浪费时间。
我建议您查看链接的维基百科文章,了解有关一般主题的一些教育,然后在 github 上寻找一个库,它提供了某种用于 json 搜索的 trie 功能;当然,除非您有足够的信心自己实施一个。
我正在为我的 WordPress 网站上的一个页面创建一个新表单,我想在此表单的其中一个输入中添加一个使用 jQuery 的实时搜索功能,该功能列出了可能的选项关于用户到目前为止输入的内容。我过滤的数据集是一个非常大的 JSON 对象,存储在我的主题中,包含超过 70,000 key/value 对。因为我目前在每个 keyup 上循环遍历整个对象,所以我实现的实时搜索非常慢并且经常冻结。
使用 jQuery 对大型数据集执行实时搜索的最有效方法是什么?
jQuery 用于 DOM 操作,在这里不会有用。
JavaScript 可以解决这个问题,但是,随着您服务的数据的增加,它也将变得越来越明显,它应该可以通过缓存内存或数据库中的服务器访问。
JSON 的大小可能会影响页面加载速度,对于某些可用内存较小的设备,可能根本无法加载页面。
除此之外,您需要做的是在键中构建一个查找结构。这种设计模式称为"trie"。如果没有任何示例代码可以继续,为了示例而在这里实现将是浪费时间。
我建议您查看链接的维基百科文章,了解有关一般主题的一些教育,然后在 github 上寻找一个库,它提供了某种用于 json 搜索的 trie 功能;当然,除非您有足够的信心自己实施一个。