Use redux-persist instead of local DB for big data? React Native

Redux (or MobX) and AsyncStorage would be the best choices to store data locally in React-Native for both iOS and Android.

I would personally recommend you go with Redux as it is easy to implement, use and persist (with AsyncStorage) and handles large amounts of data fairly well.

However, I do not recommend you store large amounts of data locally if this can be done server-side and only needed data is fetched locally.

Only store what is necessary locally to and fetch the rest whenever needed. Of course, this all depends on your app and the data in question. But my answer should cover the general usage of something like this.

This is an example on how to use redux persist along with redux using AsyncStorage:

import 'react-native-gesture-handler'
import React from "react";
import AsyncStorage from '@react-native-async-storage/async-storage'
import { Provider } from 'react-redux'
import { createStore, compose, applyMiddleware } from 'redux'
import { persistStore, persistReducer } from 'redux-persist'
//store all your reducers here
import reducers from './src/Redux/reducers'
import { PersistGate } from 'redux-persist/lib/integration/react'
import createSagaMiddleware from 'redux-saga';
//React navigation
import Navigation from "./src/Navigation";
import rootSaga from './src/Redux/Sagas';

const sagaMiddleware = createSagaMiddleware()

const persistConfig = {
  key: 'root',
  storage: AsyncStorage,
  //an array that has whichever reducers you want to persist
  whitelist: ['BananaReducer'],
}

const persistedReducer = persistReducer(persistConfig, reducers)

const store = createStore(
  persistedReducer,
  {},
  compose(applyMiddleware(sagaMiddleware)),
)

sagaMiddleware.run(rootSaga)

export default function App() {
  const persistor = persistStore(store)

  return (
    <Provider store={store}>
      <PersistGate persistor={persistor}>
        <Navigation />
      </PersistGate>
    </Provider>
  )
}