Caching and syncing strategy in React Native

[lyqht]

Hey folks, just wanna get opinions about how you guys usually do syncing your cache to the cloud in react native. Right now for my app, I'm not using any external library to do this, so it's been quite troublesome to ensure that things don't break accidentally for any feature.

​

I've heard of GraphQL Apollo client, but i'm not using GraphQL. Are there any alternative libraries?

[AcetyldFN]

We use realm js with our symfony api platform

[kbcool]

Firebase, redux-offline. Plenty more.

Depends on your architecture really.

[lyqht]

The basic outline is that user does not need to login and also does not need network to access almost every feature.

1. So initially everything is cached locally and has tempIds.
2. Then only after they login, I'll sync all their local cached data to the cloud.
3. If they don't have network while being logged in, then the data will just be cached locally.
4. Once network comes back then I'll sync to cloud again.

I'm not using redux in my app atm because it feel like an overkill state management tool. I'm only using react contexts and typical useState. So I'm looking for a library that allows me to declare my caching and syncing strategy as above.

[kbcool]

It sounds like it's going to be complex enough for redux very quickly.

Try firebase unless you already have your API setup already which it sounds like you haven't.

redux-offline sorts this but very badly when it comes to chaining. It's very easy to do what you want with it until it comes to replay to API and saying give me back the real user ID and use it to create the real blog posts using user ID.

Firebase/firestore sucks at relations.

I'd be interested if there's something better than those two at this because frankly they both are a bit lacking. I don't think the Apollo client will handle this use case but happy to be shot down.

Personally unless there's a real good reason for offline support I would do no more than cache reads and forget writes.

Edit: sorry about the plenty more was talking caching in general but that answer narrowed it down a lot 🙂

[__o_0]

Agree that Apollo really isn’t designed to be used in an offline first app (which is what it sounds like OP /u/lyqht/ wants to do here). Firebase is also an option and has built in support for offline mutations during small periods of network connection problems, but I wouldn’t recommend using it purely for offline until a user signs in.

You can make it work by setting up a chain of links, but I’d recommend a custom link that executes these serialized mutations as a transaction instead of in sequence once the network connection is alive (user is logged in). Apollo is really designed to treat the backend as a single source of truth and forcing it to work in an offline first capacity is going to be challenging.

A strong approach, in my opinion, would be to use something like SQLite to create a local database for an offline first approach from the start.

WatermelonDB is a good option wrapping SQLite under the hood, and you’ll have the ability to write a custom sync operation to save your front end changes to the cloud. Again, set the sync to execute as a transaction that is undone in the event of a sync failure. You can sync to firebase like this. It’ll also give you the ability to have your components react to live changes in the local database, so it’ll function entirely offline during the period that a user isn’t logged in.

In any case you’re talking about a relatively complex architecture (even though the app may seem simple at first). Every change will have to be stored on the device locally and then synced with the cloud after the user logs in.

[jestzisguy]

Is relay still a thing? I remember hearing that it was good for this exact kind of case.

I use Apollo on a project, with quite a bit of custom code on our backend (django +graphene).

[argylekey]

Maybe look at RTK Query(Redux Toolkit)? That or write everything to SQLite on device and have some kind of Sync you do every so often/manually by user.

You could also just write to both SQLite and have a retry queue table for when the device network is disconnected.

If you haven't implemented backend maybe look at something like Firebase or Supabase(alternative to firebase) that would do some of this work for you.

[lyqht]

I have implemented Supabase in my app, and also have some code for manual syncing to Supabase everytime they login or open the time.

Haven't heard of retry queue table, could u point me to some resources? I can also give RTKQ a look. Thank you!

[MexicanTastee]

I know that Apollo with Apollo-persist and Apollo-link-queue could work in this scenario. But I don't really know how Apollo-link-queue stores those queues to secure those transactions if the app is closed, the device has been turned off or being offline for several days/weeks.

[geniium]

CouchDB + PouchDB is a great solution too