I am trying to create a dropdown with 10k+ entries in it. We were experience significant slow down on the app and discovered it was from the dropdown taking 12 seconds to load in the options. Are there any suggestions on more efficient implementation? I have read through multiple issues on the plotly github on this topic and while it seems like there were code changes to improve this, I could not find any examples or details on how to implement. The code we are using for the drop down is very simple, and it is getting data from a dcc.store.
dcc.Dropdown(
id=“projects”,
multi=True,
value=[“agroal”],
options=[
{“label”: x, “value”: x}
for x in entries
],
)
Hey @adamschroeder, I’m on the same team as @cdolfi working on this issue. At the moment, using a dynamic callback isn’t feasible unless we prevent the update for substrings of 3 characters or fewer. Searches of 1-character-long substrings (start of any query) trigger the callback and return a very large subset of the possible options which puts us in the same position as before with ~10,000 options being passed into the Dropdown bar.
Therefore this option isn’t possible for us without further optimization. Any knowledge of common designs in this situation that would be more optimal?
In the time since posting this I found a successful work-around that should have been obvious earlier but wasn’t: we can just limit the number of results from the searchbar to some relatively small number (250 for me right now) and that’s just fine.
Since posting this I’ve had a few further issues, but I also posted a Minimum-Working-Example of what I implemented here, in case someone in the future finds the design that worked for me helpful: