I have a little App built with Laravel and Angular. I have an input where the user can search with autocompletion. And I can't decide what is the best approache to handle this :
1 - Get all the data from the API and leave the filtering on the client side with Angular
2 - Get the data from the API while the user it typing and so make the filtering on the server side with MySQL.
I plan to have 500 rows or something like that. What would you do ?
I think having both is better just like a traditional site. The client side filtering will be for better UX and the server site filtering would be for the data you require. You don't really need to return all results all the time (even if they are paginated) so caching will help you here to improve the performance.
@Ruffles : I don't understand what your are saying. If I have 500 products and the user can choose one with the autocomplete field I have to filter on client or server side, but if on the client, I need all the rows to be able to search throught all of them...
I am saying, you'll probably need to do the filtering on the server side, the client side filtering is just for better user experience.
Let's say the user opens the page and tries to search for a newly created user which registered 1 second ago. The user will have to go back and then get the new results if there's no server side filtering.
If you do client side filtering only, the new results won't be there. Server side filtering brings you new results every time you filter the API.
So it's better if you do filtering on both sides, client and server.
So you mean, when the user start typing in the autocomplete I get All the results from my API then I use client side to filter them from what he enter in the auto-complete ?
I was kind of worried to give back all my results from my API to the client side at once as @JeffreyWay said it can be a bad pratice in is video about creating an API...
In your specific case of autocomplete, with just 500 rows it's probably ok to keep that client-side. After all, the data is no more than a moderately sized CSS file and you will save on repeated requests to the server. However, think about how often the autocomplete data might change. If it happens all the time then some data will be missing unless you refresh the client-side data often.