CODEWITHSUNDEEP
react-nativesearchpaginationreact-native-iosreact-native-flatlist
Nirali
Nirali

Reputation: 1786

Implement Search functionality with large data in react native

I have 50K+ records in my db,I want to add search filter without affecting performance of the application .Please suggest me what approach I should adopt to search the large data.

I am calling api to fetch data from server. And used react native search functionality. But due to large data i have implemented pagination at server side so each time new api being called and new data fetched from server. Now issue is it will search only from fetched page records and i want to search from all 50K+ records. And i want to search for each character typed. So I think it is not fissible to call api at each character typed.

So what is the best approch?

Upvotes: 1

Views: 2696

Answers (2)

Vishal Jadav
Vishal Jadav

Reputation: 984

You can use redux for this situation. When you start your application get all records(50+K) from server it will take time(You can get records in splashscreen) based on your server and store all records in redux store. Now you can search data from your redux store so don't need to call API on every search.

Make sure your server send only those data in response which you required to show in mobile application. So for getting records it will reduce response time.

You can use redux-search for this.

Upvotes: 0

Selim Mıdıkoğlu
Selim Mıdıkoğlu

Reputation: 136

I have a quote finder app which holds 400k quotes on mongodb and I am using Node JS as backend. In my point of view if you are going to search more than 100 items in your front end lets say you are going to use flatlist you can create your searching algoritms in front-end side, than you can dynamically render your list according to search results. 100 items are not a specific limit it is just my idea. Because in lists more data than that would look ugly.

For 50k search you definitely have to come up with search algorithms on server-side. After you get your search data you can use

https://github.com/UnPourTous/react-native-search-list

And if your specific aim is to search on server-side I would recommend elastic-search.

But for 50k data it is better you implement your own algoritms. When you send fetch request let your server run the search and in response get the data you want.

Upvotes: 1

Related Questions