Skip to content

Conversation

@gund
Copy link
Collaborator

@gund gund commented Jul 14, 2017

In this PR I put some extra options for even more aggressive optimizations of extremely large sets of options (>5000).

I found that it was not enough of what I did in my previous PR because as I thought the source of lag was only in rendering.
As it turned out after testing - it's not only there but in filtering as well.

Quite a bit of measurements before and after improvement to have some numbers (tested on real mobile devices):

Lag/delay after every character type Before Optimizations After Optimizations
Avg ~6s ~500ms
Min 5s 50ms
Max 6.5s 1.6s

So as numbers speaks the worst case scenario could get about 1.6s but most of the time the search feels instantaneous to the user after these optimizations.

To enable/control this optimizations there are a bunch of new settings which should be changed in order to enable it:
searchMaxLimit: Is used to limit a number of items being filtered in memory
searchMaxRenderedItems: Is used to further limit a number of items being rendered to the user

Besides those limits the filtering was tweaked to speedup the process: search results are now aggressively cached and reused as much as possible taking into account searchMaxLimit setting.

Also after all of the optimizations the result was so good that I decreased number of min characters to trigger filtering to just 1 by default.

Here I will share my settings for optimized large sets of options I use just for reference:

searchRenderLimit: 100 // Apply optimized search only for dropdowns with 100+ items
searchRenderAfter: 1 // Start filtering right after one character
searchMaxLimit: 500 // Limit search results in memory to 500 items
searchMaxRenderedItems: 20 // Render only top 20 results to user

Thanks

@softsimon softsimon merged commit 395da56 into softsimon:master Jul 14, 2017
@softsimon
Copy link
Owner

Hmm. After merging this I only get "Nothing found..." as only option in my basic dropdrown test without any settings. Haven't investigated any further yet.

@gund
Copy link
Collaborator Author

gund commented Jul 22, 2017

That's strange. Do you have a test to share with me?

@softsimon
Copy link
Owner

Even the most basic example doesn't work for me. Could be related to this or anything else committed after 1.4.0. Have you tried running 1.5.0 from NPM?

@ghost
Copy link

ghost commented Jul 23, 2017

@softsimon take a look at #235

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants