React-autosuggest: Performance optimizations & roadmap

[osala-netquest]

Is there any plan/idea about expose a simple api for applying performance optimizations such as windowing?

Thank you in advance

[moroshko]

Yes, I'd like to explore how react-virtualized can be integrated, but haven't had the time to do this yet.
We'll have to start from react-autowhatever that renders the suggestions.
If you have any ideas, please don't hesitate to share!

[moroshko]

@osala-netquest Do you have a plain list or multi section?

[osala-netquest]

Hi @moroshko, sorry for the late response...

I'm using a plain list, that renders between ~300 and ~8000 items.

I think react-virtualized is a great solution, but without applying it on react-autowhatever, so without reaching its potential, only with few lines of code we could greatly improve the performance.

If you plan to optimize react-autowhatever I'll be happy to help you! Do you want to use this thread for talking about these optimizations or your prefer to create another one in react-autowhatever repo?

[moroshko]

I had a chat with @bvaughn about this last week, and have a good idea of what needs to be done in react-autowhatever. Actually, I already started working on this.
I'll post an update here when I get closer.

[osala-netquest]

Awesome news!

If you want me to help you with anything let me know.

[cherniavskii]

Hey @moroshko, are there any updates on this issue?

[austinh]

Also interested in some updates. I'm rendering about 250 items and it definitely slows down, even if I do a .slice(0, 50) it still tends to slow down. Also, using alwaysRenderSuggestions={true} significantly slows things down.

[GenoD]

I have a similar use case in that I have to autoSuggest based on matches in a company's inventory ID numbers. The results can be as large as 10,000 given input of just string "1" because all Product ID's start with "1".

Any chance we can have an update?

[lexanth]

react-virtualized needs to be the component that actually maps list of items to components and renders them.
Currently this is https://github.com/moroshko/react-autowhatever/blob/master/src/ItemsList.js
So looks like the change needs to be there? Extract the logic out of ItemsList, and allow it to be overridden?
Happy to look into the change.