Pjaijai/Referalah

Reduce api calls to Supabase

Closed this issue · 7 comments

Right now profile is refetched every time the user visits profile page. I think it's only necessary if they update the profile.
The same goes to post fetching.
Adding invalidation on useMutation could solve the problem.
Also I don't know if supabase is charging on usage, so having reduction on API calls may save some money?

How could the ui know if the post or profile is updated by other?

Cannot, it's only cached client-side. It can only reduce api calls if the user owns the posts & profile.

If that's the case, we probably use the cache feature from nextjs. Ref: https://nextjs.org/docs/app/building-your-application/caching#full-route-cache

If that's the case, we probably use the cache feature from nextjs. Ref: https://nextjs.org/docs/app/building-your-application/caching#full-route-cache

Thanks for letting me know, this is so much better! Don't know they have caching this under the hood.

Also found this https://nextjs.org/docs/app/building-your-application/data-fetching/fetching-caching-and-revalidating

Can experiment to see how they work.

@511234 @ken31ee For user profile, we can do static generation. After updating the profile, we invalidate the api and tankstack can do this action. https://tanstack.com/query/v4/docs/react/guides/query-invalidation

For location apis, we can to static generation. The apis will be called when the page is in build time only. The data will be cached on Frontend and no api will be called in runtime.

For user count api, we can to incremental static generation. https://nextjs.org/docs/pages/building-your-application/data-fetching/incremental-static-regeneration

As the application scale, It is better switch all the thing to be static generation or incremental static generation which is a trend in frontend. Better than sever side rendering I think

Done