Best Practices Around Multiple API Calls on the Same Page?

Brandon Hassler

I've got some pages I'm wanting to build in Bubble that are similar to this example you can see on Amazon (it may be hard to tell, but what you see below is all one page on Amazon):

In my case, all three sections would be calling on the same "Product" table I have in Xano, but each call with its own criteria (best sellers, top rated, etc). Each section would pull in 5 results with a "more" button that would open a new Bubble page with the "full" results from Xano.

I love the idea of having pages like this that are super dynamic and can show information from several sources at once, but I also want to be mindful of my Xano capacity. In this case, everytime a user loads this page that's 3 simultaneous calls that are made. Granted, I can incorporate caching here to help ease the load, but is there a more efficient way of doing this or is this simply the "cost" of having a more dynamic ecommerce site?

Felix Tan-2030210

You could potentially structure a single API call to return all 3 results at once, as Xano allows you to structure your response.

If you wanted just a single API call / response, I'd probably return an object with 3 arrays of products.

I'm not too sure how much "capacity" you'd be saving on that though, seems like 3 API calls would do just fine. Might even be better from a UX point of view (Each table loading subsequently is better than waiting longer for all 3 tables loading at once).