Dropdown selector with a long list is very slow

[jamestwebber]

This might be a plotly issue rather than a Dash issue, I'm not sure.

We've built some dropdown selectors that have very long lists of options (several thousand), and trying to use them is very slow. I couldn't figure out where the options are stored, but I did confirm that it's not going back to the server at least (because I can stop the server and still select a new item).

If there's a way to make the widget more responsive at the expense of memory that would be well worth it for us.

[chriddyp]

Here's a simple example with 1000 items:

Which seems pretty fast. There might be something else that's going on here that would make it slow. Could you share a simple but slow example?

[jamestwebber]

"Very slow" might have been a slight exaggeration, but I am impatient (and the users are more impatient). With ~23000 items there's a couple second delay between clicking and getting a list, and there's also a delay between typing and getting any feedback:

[chriddyp]

Ah yeah, different story with 23,000 items. That is slow! It looks like we could maybe swap out the dropdown with https://github.com/bvaughn/react-virtualized-select/ to make it faster....

[chriddyp]

Just tried out react-virtualized-select on 10k points and it froze 😕

[chriddyp]

ah but maybe https://github.com/bvaughn/react-select-fast-filter-options

[chriddyp]

woohoo! now that's what i'm talking about:

[chriddyp]

OK, published it to a pre-release channel. @jamestwebber - could you try it out?

pip install dash-core-components==0.10.0rc1

[chriddyp]

It works pretty well for 50k options, but starts to bog down at 100k options

[jamestwebber]

That sounds like it'll be plenty fast for us, I will give it a shot soon. Thanks for the super fast response!

[jamestwebber]

Just tried it out, very snappy. 👍

[chriddyp]

Now part of dash-core-components==0.11.0 🍻

[LucaMarconato]

@chriddyp I have tried using the dropdown in the official example here: https://dash.plotly.com/dash-core-components/dropdown with some thousands of points and the page is very slow at loading (seconds). Is your solution using a different Dash widget?

[GitHunter0]

Hey @chriddyp , would you be willing to reopen this thread?

There is a javascript plugin virtual-select that solves this issue without the pitfall of only displaying the options available for the user filter, which is the case of the Dynamic Options.

There is an R Shiny extension which employs that plugin and the result is really good: https://dreamrs.github.io/shinyWidgets/reference/virtualSelectInput.html

Thank you

[gvwilson]

Thanks @GitHunter0 - I'll reopen the issue and if you'd like to submit a PR I'll make sure it gets reviewed as quickly as possible - thank you.

[gvwilson]

Hi - I spoke with one of our developers, and the old dropdowns have been replaced with virtualized ones, which should apply in all cases except dynamic options. If that's your use case, could you please file a fresh issue with a minimal reprex and include @gvwilson in the comment so that it lands in my inbox? thanks - Greg