Quelles sont mes options pour stocker des données lors de L'utilisation de React Native? (iOS et Android)

je suis encore nouveau dans le monde natif de React, et généralement dans le monde mobile/natif aussi, et je trouve la documentation un peu manquant quand il s'agit de persistance de données.

quelles sont mes options pour stocker des données dans React Native et les implications de chaque type? Par exemple, je vois qu'il y a un stockage local et un stockage asynchrone, mais je vois aussi des choses comme Realm, et je ne comprends pas comment tout cela fonctionnerait avec une base de données externe.

je veux savoir spécifiquement:

  • quelles sont les différentes options pour la persistance des données?
  • pour chacune, quelles sont les limites de cette persistance (c.-à-d. quand les données ne sont-elles plus disponibles)? Par exemple: lors de la fermeture de l'application, redémarrage du téléphone, etc.
  • pour chacun, y a-t-il des différences (autres que la configuration générale) entre l'implémentation dans iOS vs Android?
  • comment font les options comparer pour accéder aux données hors ligne? (ou comment est l'accès hors connexion généralement traitées?)
  • y a-t-il d'autres considérations que je devrais garder à l'esprit?

Merci pour votre aide!

85
demandé sur Sia 2017-06-05 22:07:47

3 réponses

voici ce que j'ai appris en déterminant la meilleure façon d'aller de l'avant avec quelques-uns de mes projets actuels du PPA.

"151930920 Async" Stockage ("built-in" pour Réagir Native)

j'utilise AsyncStorage pour une application en production. Le stockage reste local à l'appareil, est non crypté (comme mentionné dans une autre réponse), disparaît si vous supprimez l'application, mais doit être sauvegardé dans le cadre des sauvegardes de votre appareil et persiste pendant les mises à niveau (à la fois améliorations natives vol D'essai ala et mises à niveau du code via CodePush).

Conclusion: stockage Local; vous fournissez votre propre solution de synchronisation / sauvegarde.

SQLite

D'autres projets sur lesquels j'ai travaillé ont utilisé sqlite3 pour le stockage app. Cela vous donne une expérience de type SQL, avec des bases de données compressibles qui peuvent également être transmises vers et depuis l'appareil. Je n'ai pas eu d'expérience avec les synchronisant avec un back-end, mais j'imagine que les différentes bibliothèques existent. Il existe des bibliothèques RN pour se connecter à SQLite.

les données sont stockées dans votre format de base de données traditionnel avec des bases de données, des tables, des clés, des indices, etc. tous enregistrés sur disque dans un format binaire. L'accès Direct aux données est disponible via la ligne de commande ou les applications qui ont des pilotes SQLite.

Conclusion: stockage Local; vous fournissez la synchronisation et la sauvegarde.

Firebase

Firebase offre, entre autres, une base de données noSQL en temps réel avec un magasin de documents JSON (comme MongoDB) destiné à garder de 1 À n Le nombre de clients synchronisés. Les docs parlent de la persistance hors ligne, mais seulement pour le code natif (Swift/Obj-C, Java). L'option JavaScript de Google ("Web") utilisée par React Native ne fournit pas d'option de stockage en cache (voir la mise à jour 2/18 ci-dessous). La bibliothèque est écrite avec l'hypothèse que d'un navigateur web va être connectée, et il y aura donc une connexion semi-persistante. Vous pouvez probablement écrire un mécanisme de mise en cache local pour compléter les appels de stockage Firebase, ou vous pouvez écrire un pont entre les bibliothèques natives et React Native.

[mise à jour 2/2018] j'ai depuis trouvé React Native Firebase qui fournit une interface JavaScript compatible avec les bibliothèques natives iOS et Android (faisant ce que Google aurait probablement pu/aurait dû faire), donnant vous tous les goodies des bibliothèques natives avec le bonus du support natif React. Avec L'introduction par Google d'un magasin de documents JSON à côté de la base de données en temps réel, je donne à Firebase un bon second regard pour certaines applications en temps réel que je projette de construire.

la base de données en temps réel est stockée comme un arbre de JSON-like que vous pouvez éditer sur le site et importer/exporter assez simplement.

Conclusion: avec react-native-firebase, RN obtient les mêmes avantages que Swift et Java. [/mettre à jour] Balance bien pour les appareils connectés au réseau. Faible coût pour une faible utilisation. Combine parfaitement avec D'autres offres de Google cloud. Données facilement visibles et modifiables à partir de leur interface.

Realm

est aussi un magasin d'objets en temps réel avec synchronisation réseau automatique. Ils se vantent d'être "device first" et la vidéo de démonstration montre comment les appareils gèrent la connectivité réseau sporadique ou avec perte.

ils offrent une version gratuite de l'objet store que vous hébergez sur vos propres serveurs ou dans une solution cloud comme AWS ou Azure. Vous pouvez également créer des magasins en mémoire qui ne persistent pas avec l'appareil, des magasins uniquement sur l'appareil qui ne se synchronisent pas avec le serveur, des magasins uniquement sur le serveur en lecture seule, et l'option de lecture-écriture complète pour la synchronisation sur un ou plusieurs appareils. Ils ont des options professionnelles et d'entreprise qui coûtent plus d'avance par mois que Firebase.

Contrairement à Firebase, toutes les fonctionnalités de Realm sont prises en charge dans React Native et Xamarin, tout comme elles le sont dans les applications Swift/ObjC/Java (native).

vos données sont liées aux objets de votre code. Parce qu'ils sont des objets définis, vous avez un schéma, et le contrôle de version est un must pour la santé du code. L'accès Direct est disponible via les outils GUI que fournit Realm. Les fichiers de données de l'appareil sont compatibles avec toutes les plateformes.

Conclusion: premier appareil, synchronisation facultative avec des plans gratuits et payés. Toutes les fonctionnalités prises en charge dans React Native. L'échelle horizontale coûte plus cher que Firebase.

iCloud

honnêtement, je n'ai pas beaucoup joué avec celui-ci, mais je vais le faire dans un proche avenir.

si vous avez une application native qui utilise CloudKit, vous pouvez utiliser CloudKit JS pour vous connecter aux conteneurs de votre application à partir d'une application web (ou, dans notre cas, réagir Native). Dans ce scénario, vous auriez probablement une application iOS native et une application Android native React.

comme Realm, cela stocke les données localement et les synchronise avec iCloud lorsque c'est possible. Il y a des magasins publics pour votre application et des magasins privés pour chaque client. Les clients peuvent même choisir de partager certains de leurs magasins ou objets avec d'autres utilisateurs.

Je ne sais pas s'il est facile d'accéder aux données brutes; les schémas peuvent être configurés sur le site D'Apple.

Conclusion: Idéal pour les applications Apple-targeted.

Couchbase

Grand nom, beaucoup de grandes entreprises derrière elle. Il y a une édition communautaire et une édition D'entreprise avec les coûts de support standard.

ils ont un tutoriel sur leur site pour accrocher des choses Jusqu'à réagir Native. Je n'ai pas passé beaucoup de temps sur celui-ci, mais il semble être une alternative viable au Royaume en termes de fonctionnalité. Je ne sais pas comment facile il est d'obtenir vos données en dehors de votre application ou n'importe quel Api que vous construisez.

[Edit: trouver un lien plus ancien qui parle de Couchbase et CouchDB, et CouchDB peut être encore une autre option à considérer. Les deux sont historiquement liés, mais actuellement des produits complètement différents. Voir cette comparaison .]

Conclusion: semble avoir des capacités similaires à celles du Royaume. Peut être sur périphérique ou synchronisé. J'ai besoin de l'essayer.

MongoDB

j'utilise ce côté serveur pour une partie de l'application qui utilise asyncstorage localement. J'aime que tout soit stocké sous forme d'objets JSON, ce qui rend la transmission vers les appareils clients très simple. Dans mon cas d'utilisation, il est utilisé comme cache entre un fournisseur amont de données de guide TV et les appareils de mon client.

il n'y a pas de structure dure aux données, comme un schéma, donc chaque objet est stocké comme un "document" qui est facilement consultable, filtrables, etc. Des objets JSON similaires pourraient avoir des attributs supplémentaires (mais différents) ou des objets enfant, permettant une grande flexibilité dans la façon dont vous structurez vos objets/données.

Je n'ai pas essayé les fonctionnalités de synchronisation client-serveur, et je ne l'ai pas utilisé intégré. React Native code for MongoDB existe.

Conclusion: solution NoSQL locale, pas d'option de synchronisation évidente comme Realm ou Firebase.


[Edit] j'ai passé du temps avec Realm depuis que j'ai écrit ceci. J'aime la façon dont je n'ai pas à écrire une API pour synchroniser les données entre l'application et le serveur, semblable à Firebase. Les fonctions Serverless cherchent aussi à être vraiment utiles avec ces deux-là, limitant la quantité de code d'arrière-plan que je dois écrire.

j'aime la souplesse de la MongoDB magasin de données, de sorte que devient mon choix pour le côté serveur de web et d'autres de connexion-applications nécessaires.

j'ai trouvé RESTHeart , qui crée une API RESTful très simple, évolutive à MongoDB. Il ne devrait pas être trop difficile de construire un composant React (natif) qui lit et écrit les objets JSON à RESTHeart, qui à son tour les passe à/de MongoDB.


[modifier] j'ai ajouté des informations sur la façon dont les données sont stockées. Parfois il est important de savoir combien de travail vous pourriez être dans pour pendant le développement et les tests si vous avez à modifier et tester les données.

117
répondu Bryan Scott 2018-02-22 04:55:12

Rapide et sale: il suffit d'utiliser Redux + réagissent-redux + redux-persist + AsyncStorage pour réagir indigènes.

il s'adapte presque parfaitement au monde natif de react et fonctionne comme un charme à la fois pour android et ios. En outre, il y a une communauté solide autour de lui, et beaucoup d'information.

pour un exemple pratique, voir le F8App à partir de Facebook.

Quelles sont les différentes options pour la persistance des données?

avec react native,vous voulez probablement utiliser redux et redux-persist. Il peut utiliser plusieurs moteurs de stockage. AsyncStorage et redux-persist-filesystem-storage sont les options de RN.

il y a d'autres options comme Firebase ou Realm, mais je n'ai jamais utilisé celles sur un projet RN.

pour chacun, quelles sont les limites de cette persistance (c'est à dire, lorsque les données ne sont plus disponibles)? Par exemple: lors de la fermeture de l'application, redémarrage du téléphone, etc.

en utilisant redux + redux-persist vous pouvez définir ce qui est persisté et ce qui ne l'est pas. Lorsque Non persisté, les données existent pendant que l'application est en cours d'exécution. Quand persisté, les données persistent entre les exécutions de l'application (fermer, ouvrir, redémarrer le téléphone, etc).

AsyncStorage a une limite par défaut de 6MB sur Android. Il est possible de configurer une limite plus grande (sur le code Java) ou d'utiliser redux-persist-filesystem-storage comme moteur de stockage pour Android.

pour chacun, y a-t-il des différences (autres que la configuration générale) entre l'implémentation dans iOS vs Android?

utilisant redux + redux-persist + AsyncStorage la configuration est exactement la même sur android et iOS.

comment comparer les options pour accès aux données hors ligne? (ou comment est l'accès hors connexion généralement traitées?)

avec redux, offiline access est presque automatique grâce à ses pièces de design (action creators et reducers).

toutes les données que vous avez récupérées et stockées sont disponibles, vous pouvez facilement stocker des données supplémentaires pour indiquer l'état (fetching, succès, erreur) et l'heure où il a été récupéré. Normalement, demander un fetch n'invalide pas les données plus anciennes et vos composants ne font que mettre à jour lorsque de nouvelles données sont reçues.

il en est de même dans l'autre sens. Vous pouvez stocker les données que vous envoyez au serveur et qui sont encore en attente et les traiter en conséquence.

y a-t-il d'autres considérations que je devrais garder à l'esprit?

React favorise une façon réactive de créer des applications et Redux s'y adapte très bien. Vous devriez l'essayer avant d'utiliser juste une option que vous utiliseriez dans votre Android régulier ou de l'application iOS. En outre, vous trouverez beaucoup plus de docs et d'aide pour ceux.

29
répondu Filipe Borges 2017-06-14 16:47:05

les gens ci-dessus frappent les bonnes notes pour le stockage, bien que si vous avez également besoin de considérer toutes les données PII qui doit être stocké, alors vous pouvez également cacher dans le porte-clés en utilisant quelque chose comme https://github.com/oblador/react-native-keychain puisque ASyncStorage n'est pas crypté. Il peut être appliqué dans le cadre de la configuration de persist dans quelque chose comme redux-persist.

6
répondu Jeff Chew 2017-06-14 16:35:45