jquery autocomplete custom combobox- ui hangs

[akashdeepjaiswal]

dropdown is too slow to render when data is close 5000. How to limit options like show first 100 data then add option like more data avaible then when clicked on this it bring another 100 and so on

[mgol]

Thanks for the report. Does the issue you describe exist when jQuery UI 1.12.1 is used or only with jQuery UI 1.13.0 or newer?

[voc0der]

Even if it's less than 5000, it slows to crawl in the new one. Been using jQuery UI 1.12.1 for years, with a custom autocompleting combobox I wrote; albeit hacky, it does work excellently with tens of thousands of records in 1.12.1 and lags like crazy in 1.13.0 thus we cannot upgrade.

https://github.com/noblesigma/jQuery.UI.Combobox.Lazyload

[dmethvin]

Can you provide a link to a simple test case? I'm curious what might have changed.

[mgol]

Yes, a test case would definitely help.

[fnagel]

This is about the https://api.jqueryui.com/autocomplete/ widget, right?

I don't think this widget is able to work with thousands of options. Not even hundreds. I would strongly recommend to use its AJAX filter functionality.

https://api.jqueryui.com/autocomplete/#option-source
https://jqueryui.com/autocomplete/#remote

[voc0der]

I will try to provide a test case soon. This is definitely a before I had it working now it doesn't work with the new version thing, sorry guys, I know it sucks I just haven't had much time. The github example admittedly is a bit old and it doesn't self host work again, so it will take me some time to make you a new demo.

It doesn't work well with hundreds of thousands of options, if they get rendered into the DOM, no, but generally if you allow people to type one to two letters, they find it before it gets that big, so in most every case anyways.

Like I said, I hope to have an example for you that doesnt need a server soon since its just JSON.

[voc0der]

https://github.com/noblesigma/jQuery.UI.Combobox.Lazyload/tree/master/example/breakingExample

If you download those files locally and load it from a browser, like firefox, you can see that index-working works (just scroll down and wait, and the 2nd chunk will load in that same dropdown), and index-non-working doesn't work. The only difference is the jQueryUI version; and if you really wanted, the json could go up to 20K+ lines in 1.12.1 without breaking, but in 1.13.0 it breaks in under 1.5k.

Sorry it took so long. Good luck. Please let me know if you need help with something.

[mgol]

Thanks for the test case! That helps a lot.

I did a performance profile on both 1.12.1 & 1.13.0 test cases and it looks like the performance regression is caused by ef2e9ba. The added bindRemoveEvent function triggers this._on calls for all of those elements which takes a lot of time.

[fnagel]

@noblesigma Thanks for the test case, I now understand what's the issue here!

@mgol Looks like an ugly bug here as Scott's commit fixed a few bugs. Seems like a complicated one. Not sure what to do :-/