I've been playing a lot with GraphQL and Apollo lately, but I am usually unsure about best practices when it comes to querying the server and getting results back.
Now, say I have a list of locations which I want to display in a paginated list:
Let's say I decide to use Apollo's pagination capabilities and get 10 locations at a time:
- If I want to filter by city using a dropdown with all cities in the DB, the paginated results will return me only the cities within those 10 locations. Should I then make a separate query for that (eg.
allCities {...})? - Then if I select a city as a filter, I should make yet another new query filtered by the city, right?
Or should I just ditch Apollo's pagination and query all locations, and do all the pagination and filtering in the client? In that case, how much is too much data for an initial load?
Or am I missing something?
Please help!
Thanks!!
Greetings from Berlin...
Top comments (3)
I think the best and performant way to do this is through cursors. Making pagination at client side doesn't have so much sense due the nature of GraphQL of get only the data that you need. There is no the best overall solution when we talk about this topic, you should pick the best way that works for you.
It seems like an interesting paradox: while you only get the data you need, you end up calling the server more times with specific requests?
Of course, yes. However, it doesn't matter. Always bet on small chunks of data when you need it instead one big request. It's a good practice for web performance and UX. You could make a single request for thousand of records and process it inside a worker but the negative impact on slows networks still there.