Can Firebase work offline with React Native?

Question

I have an existing iOS app that I'd like to start adding some React Native screens to. The app uses Firebase with persistence enabled so that it works offline. Is there a way to also use Firebase directly within React Native while maintaining offline functionality?

If the answer is "Yes", do iOS and React Native share the same local data store? This would be important, so that offline data changes on iOS screens would reflect data changes made from React Native screens and vice versa.

Thanks for sharing your insight on this!

Solution 1

The javascript SDK will persist new write requests when you are offline and will sync with the server once you go online. But if you were hoping to show a list with data that was previously fetched from firebase, then you are out of luck with Javascript. One of the answers mentions Firestack, but it is no longer supported.

On a project I just ended up installing this package https://github.com/invertase/react-native-firebase. It is a bridge to the native ios & Android SDKs for firebase and if you use it you can also use persistence.

Tested and verified. All works great! :)

Solution 2

Alternatively, you can use Firestack, which is a native library that works with both iOS and Android on react native.

Offline support is enabled along with storage, the real-time database, authentication, remote configuration (in development), etc.

(disclosure: I am one of the primary authors of Firestack)

Solution 3

Firebase's offline disk persistence is currently only available in its native iOS and Android SDKs. It is not yet available for JavaScript SDK.

Solution 4

UPDATE:

• It is now possible https://firebase.google.com/docs/database/web/offline-capabilities

OBSOLETE:

• As of Firebase JavaScript SDK 3.1.0, offline persistance is still unavailable. It's recommended you use React Native's AsyncStorage.

Solution 5

All of the answers above are out of date!

As of JULY 2020 offline persistence is supported out of the box when you use react-native-firebase.

Read more here: https://rnfirebase.io/firestore/usage#offline-capabilities

View more solutions

Comments

[bgolson]

Wow, thanks so much for the quick response Frank! Is this something you guys are adding to the Javascript SDK? And if so, do you foresee being able to synchronize the local datastore between React Native and Native iOS?

[Oximer]

Anyone knows if this answer keep updated after the last react update?

[user2552643]

Ah you're right, but it's still a good library to interface RN with Firebase, imho.

[T4deu]

Yes, it's an answer, and a good one at that, what's the matter if he created the repo?

[mamu]

Firebase can work offline just like web, but changes don't get persisted physically it has to be flushed before ending the session.

[rebelliard]

It is now possible firebase.google.com/docs/database/web/offline-capabilities

[Frank van Puffelen]

@rebelliard At the moment that page only talks about temporary connectivity loss, in which case Firebase has always continued to function. But the Firebase Database's web client does not keep the data across page reloads.

[bgolson]

This looks like the library that can make react-native viable for my future iOS projects. Thanks so much for sharing @Daniel!

[MarksCode]

Hey Daniel. So would you recommend using this package for my cross-platform firebase/react-native app? Like instead of npm install firebase I would just do npm i react-native-firebase? What are the advantages? Thanks.

[Daniel Dimitrov]

It works good. I'm using it in a project, that's not yet in the AppStore, but soon to be. It's faster then the js implementation and offers offline persistence - which is required in our project. A side benefit is - analytics, crash reporting. They even have phone auth in the latest version (I haven't tested it yet). I think that it's a pretty solid replacement for the firebase JS API in RN.

[romin21]

Keep in mind that react-native-firebase doesn't work well with Expo though.

[Mike Hardy]

I am using phone auth from react-native-firebase and it is great. With firestore offline persistence is default enabled for ios/android - makes this a very easy to use setup once you get everything installed correctly