jQuery自动完成性能随每次搜索而下降 [英] jQuery Autocomplete performance going down with each search

问题描述

我在使用jQuery Autocomplete插件时遇到问题.

I am having an issue with jQuery Autocomplete plugin.

通过使用术语"item"搜索多个时间，起初它可以正常工作:mouseover上的css类被很好地添加了，并且一切都很顺利.通过单击弹出窗口外部以将其关闭，然后在每次看起来一切变慢时再次键入:

By searching mutltiple times with term "item", at first it works okay: css classes on mouseover are added nicely and everything is smooth. By clicking outside of the popup to close it and typing again each time everything seems to work slower:

我在速度非常慢的Chrome和Firefox上似乎进行了测试，Firefox似乎处理得更好，但是性能却有所下降.

I tested it on Chrome which gets very slow and on Firefox which seem to handle it a bit better but also has a performance degradation.

这是一个非常简单的代码: https://jsfiddle.net/re9psbxy/1/

Here is a fiddle with very simple code: https://jsfiddle.net/re9psbxy/1/

和代码:

var suggestionList = [];
for (var i = 0; i < 200; i++) {
  suggestionList.push({
    label: 'item' + i,
    value: i
  });
}

//initialize jQueryUI Autocomplete
jQuery('#autocomplete').autocomplete({
  source: suggestionList
});

HTML:

<input type="text" id="autocomplete"/>

推荐答案

我遇到了同一个问题，其中一个应用程序具有自动完成功能.自动完成功能在第一次打开时会非常快，但是几次后几乎变得毫无用处.问题似乎是自动完成功能似乎正在使用的菜单小部件中的内存泄漏.您可以通过将其添加到自动完成功能的搜索功能中来查看该问题:

I ran into the same issue with autocomplete on one of my apps. The autocomplete would be very fast the first time it opened, but after a few times it became practically useless. The problem appears to be a memory leak in the menu widget that the autocomplete seems to be using. You can see the issue by adding this to search function of the autocomplete:

search: function(e,ui){
 console.log($(this).data("ui-autocomplete").menu.bindings.length);
}

每次搜索时，您都会看到绑定的长度持续增长.要解决此问题，只需在每次搜索时清除绑定:

Each time you search, you'll see the length of the bindings continue to grow. To fix this, just clear the bindings each time you search:

search: function(e,ui){
 $(this).data("ui-autocomplete").menu.bindings = $();
}

我将此建议的解决方法发布到了打开的jquery ui错误: https://bugs.jqueryui.com /ticket/10050

I posted this suggested work around to the open jquery ui bug: https://bugs.jqueryui.com/ticket/10050

这篇关于jQuery自动完成性能随每次搜索而下降的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！