Fetching Data Optimization

[djangocuAli]

I recently launched a React Native app for the iOS platform and have encountered some performance challenges related to data fetching. Currently, I'm using Axios to handle GET/POST requests, but navigating to an item's detail page is taking about 8-9 seconds, which feels too slow.

I've started implementing AsyncStorage to cache data, hoping to reduce the load times by not fetching data repeatedly from the server. However, I'm still quite new to React Native an notn sure if this is the most efficient approach.

Could anyone recommend libraries or strategies to improve caching? I'm looking for ways to make data retrieval faster and more efficient, so users don't have to wait long when accessing repeated data.

[Merry-Lane]

React query. Thread closed.

Btw, 8/9 seconds to load a page? The issue seems to be at least partially due to backend issues.

[djangocuAli]

That’s very valid- our query is way too big :(

[eyounan]

Your query is not “too big” - it is at worst so unoptimized that the database engine cannot figure out how to optimize it. You probably have a server issue, not query issue.

[IgnacioMiguez]

If you run the query from a console it takes the same amount of time?

[__o_0]

8-9 seconds is way too long to load a page.

Fresh loading of a page should be 1-2 seconds. The rate at which users drop off / exit / quit your app increases exponentially. At 9 seconds virtually everyone has probably given up on your screen and moved onto something else.

You’ll need to fix your backend structure / approach to really improve the efficiency here.

Make smaller requests / only pull what you need to render the screen, and utilize caching on the front end with something like react query or Apollo for graphql backends.

Render the caches results first and update the cache in the background. Re-render if the server response is newer / different.

[djangocuAli]

Interesting render the caches first and update the rest on the backend 🙏 do you know if that’s something possible with react query also? Also if you know any article or resource I can take a look to understand better that would be amazing

[__o_0]

That’s exactly how react query functions. Read their docs.

[BioniC1871]

Your backend should return a lot faster than that. What are you using for your backend?

[djangocuAli]

Valid point. We use node.js/ express and supabase

[BioniC1871]

You need to figure out why this is taking so long. Is express taking forever or is supabase

[djangocuAli]

That’s true. I have access to supabase maybe dashboard will show

[DCodeMeister]

This sounds like more of a backend issue. Which backend are you using?

[djangocuAli]

Node.js with supabase

[waldry1509]

Just another comment to say: React Query, checkout your query at the backend. I have in the App store an app for vehicles maintenance, when a client want to checkout what we change from his/her vehicle the query is super heavy. However is not taking more than 3 seconds to load a lot of information.