Best practices / strategic advice for fetching and displaying data

Say I wanted to display all the (1) restaurants and (2) bars in a given downtown. Users click (1) or (2) to see what’s available to eat or drink, respectively, and I have all the data in, say, Supabase (doesn’t matter).

Would you:

(a) Fetch only the restaurant data as one single collection, and the bar data as a second? Then bind each data collection to a click event
(b) Fetch all of it, and when clicked, filter by restaurant and display only that?

Stated differently, is it better in this case to filter the returned data on the back end before displaying to the user, or grab everything and filter on the front end in response to user input? Thanks in advance.

Hi, it depends of the amount of data and the user flow.

It will be displayed on a list or on a map ? To be able to click on something you already need to have, at least, the list of available options for 1 and 2 right ?

So, to be sure to understand your question : It’s about fetching the list and choosing to include or exclude the detailed information about each restaurants and bar ?

Again I think it depend of the amount of data and your backend latency. If you prefer to have your map/list loading faster (because you will load the minimal amount of data) or the detailed information loading instantly (because the data will already be there).

The question is more about performance and security, I suppose. I think for data that are not sensitive, probably it makes the most sense to GET the entire table and filter in-app with one request, then multiple requests.

Depends on the amount. If you load 3000 records on the frontend, it could cause some issues. I’d suggest fetching only the data you need. Use pagination, and filter your data accordingly, this way you don’t overfetch data and it’s more snappy.

1 Like