React Native Thinking Offline

Muhammad Hanzala
Software Developer @ Mujadidia Inc.
CS Student @ UBIT, Karachi University
@MuhammadHanzala
@muhammad-hanzala


React Native Thinking Offline
As Web Developer: Offline Strategy

But what about Mobile Apps

Offline Strategies:
- If online, then... else...
- Read-Only Cache
-
Database Synchronization
If online, then... else...
The simplest imaginable way is simply to check if you’re online, and branch out your program logic accordingly.
But..
In real-world mobile network conditions it’s impossible to really detect when you are online.
Read-Only Cache
Save data on first request, serve on failure.
But..
It can't mutate, and hard to manage network-resilient updating of your state.
Database Synchronization
Using third-party end-to-end synchronization solution like Realm Platform
But..
It requires you to design your back end around a special-case database product
Client-Side Database
One popular option is to use a persistence database like Realm
But..
The issue is to manually synchronize our Redux store with our Realm DB, because Realm is a schema backed DB and Redux is unstructured JSON.

What's the Ideal Strategy...?
Ideal Strategy:
- can handle Read-Write data
- Pessimistic and Optimistic Updates
- can survive schema migrations on app updates
Q: How can we achieve that...?
Answer:

Redux
So the idea is..
- Your redux store will be your database
- offline-supported actions will be dispatched with an offline meta field
Don't be worry for implementing this architecture manually, we already have existing middlewares which follows these.
The best available option is...

Redux Offline
Redux Offline provides you the ability to implement network-resilient API calls, retries, optimistic UI updates, migrations and more.
Live Example
Thank you for your attention
Links:
Example Code: https://github.com/MuhammadHanzala/react-native-offline-example
Slides: https://slides.com/muhammadhanzala/react-native-thinking-offline


@muhammad-hanzala
@MuhammadHanzala
React Native - Thinking Offline
By Muhammad Hanzala
React Native - Thinking Offline
- 80