What’s the Best React Native Storage Option? 🧐

what's the best way to store data in your react native applications let's talk about the different storage options for both local data and remote databases hey everyone what's up this is Simon from galaxies.dev and today we will talk about storing data in react native applications because if you want to store data in your apps there are tons of options as always in the react ecosystem so just going to react native directory and searching for storage will reveal at least 21 libraries that you could potentially use in your app at least three of them are not maintained anymore but I will try to decrease the scope of this so enough PM talk for today and boil it down to three categories number one packages that Expo recommends because I always recommend people to get started with Expo category number two databases and storage option with remote sync option and Category 3 the Cool Kids on the Block I'll give you some recommendations when which solution really shines but before jumping into the latest and greatest packages you should really think about what your app actually needs do you only want to store settings or thousand rows of data are you updating your app once in three days or 20 times per second is it enough to have the data offline or should it be synced to the cloud as well these questions will help you to figure out the best solution to store data in your react native app because keep in mind there is no single best package and you should always evaluate the different packages that you're going to see in terms of the requirement of your own app if you have tips and tutorials just like this you will love what I've created inside galaxies.dev on Galaxies you will find all the code more tutorials and specific courses about learning react native fast so go check it out at galaxies.dev and use the code warp speed and the checkout to get 10 off your first three months of galaxies Pro also don't forget to hit the like And subscribe button below so you get updated about the new videos live streams and everything coming to this channel alright so the first category is Expo packages and I want to highlight this because I said this before Expo is great it is not what expert has been years before I highly recommend Expo to everyone getting started and I have another video about comparing X expert to the react native CLI and why you should simply use it and Expo has a dedicated page on how you can store data in your applications and I don't want to go through it from top to bottom there are four Solutions I want to put them in a different order so the first thing that I recommend for storing data in your react native applications is actually the async storage this is probably closest to what we have with local storage on the web it is a simple persistent key value storage where you can put in your data it is not really a synced anywhere but if you update your app you will still have access to these keys and yes you can put in Json data here if you serialize it but usually it's really meant for simple key value like user has seen this setting X is set to True something like that so the really the easiest solution on top of that you can put a cool package like mmkv which we're gonna see in the last section so stick around until we get to the cool kids the second option to store data could be the file system now the file system is somewhat different from the other solutions that we talk about because well it's a file system it's not really about data I mean sure you could write a Json file to the file system and read it when required but probably that's not the best idea however for media filed PDFs anything else the file system is a great way it is right inside your application you can make directories create files read them copy them do whatever you want so this can work in some solutions great for storing your data the third option of Expo would be Expo secure store this is basically like the async store we've seen before but this one is actually encrypt and securely stored so this will use I think the iOS keychain and on Android and according SDK to securely store your data it is still just a key value pair that is stored in your application but it is a more secure way so if you have some kind of sensitive data if you are handling tokens like a JWT the secure store would be a better place to store that information however ever it's also not made for huge chunks of data because reading and writing will take some time and now we come to the fourth package which is Expo sqlite and this is the one that I recommend for everyone who needs to store more than just a handful of simple strings or booleans who has connected data who wants to access a sqlite database yes this means we can write SQL statements in our code and perform transactions against the database because this sqlite database is in every IOS and Android application and we can easily access it we can even import an existing database if we want to there's a course on Galaxies about how we can do all of these things with the sqlite plugin from Expo so with this plugin you can definitely do a lot more you have your local database you can query it you can put in data and you can do most of the things that you need to do and even if you need to add some sort of sync to a different server their packages that allows you to create the is mechanism so these four Expo packages are Rock Solid packages you can't really go wrong with them especially async storage is used in many applications sqlite as well but if you need more if you don't only want to have your data locally on the device let's talk about remote options now if we talk about remote sync we could basically cover everything every API where you can just send your data and get the data back that's basically remote sync but I wanted to narrow this down into solutions that also give you the ability to work offline and then sync back and I found three packages which fit this really well so the first one would be Firebase by Google this is one of the biggest back-end as a servers I've got a few tutorials on using Firebase about authentication firestore uploading files and these are just the basic Services of Firebase so Firebase has come a really long way there are tons of different Services included uh push notifications Universal links um there's so much with Firebase ways and you can still get started and use Firebase offline and then sync it back to the cloud so this is one of the best options and one of the most popular backends as a service so the second option would be realm realm was actually acquired by mongodb some years ago and it allows you to build scalable applications that sync to the cloud using no SQL that is common with mongodb if you use mongodb before it is not a SQL database it is a nosql database so we have collections and documents which we by the way have in Firebase as well so with realm we can use this locally um just like we see here if we check out JavaScript how we can create our options and then connect to realm the cool thing again is that you basically have a database in the back end but you don't need to write your own API if you use realm and the cloud Zone from mongodb keep in mind that there might be cost involved because mongodb acquired this at some point and they're setting up their service on top of Rel film however I asked around on Twitter and many people of the react native Community replied that they are actually using realm in their applications so if you don't like Firebase if you don't like Google check out realm as an alternative speaking of Alternatives let's talk about pouchdb so I found pouchdb and couchdb and you're gonna get a bit confused about the naming here however the thing to focus on is that pouchdb is open source JavaScript database inspired by coachdb which runs well within the browser and just using JavaScript so you can have a local JavaScript database once again no uh SQL and if you want to you can easily set up a couchdb server and then sync the changes back to it this is also a very common solution although this page looks like a bit like it's from well 15 years ago probably it is still a great solution for your applications and as far as I know you can get started for free so with Firebase and realm you will definitely at some point encounter cost involved with pouch to be if you set up your own server yes you have the cost for your own server but I think you can keep the cost at a minimum alright let's leave the remote soon category and focus on two more Cool Kids on the Block that you definitely should know about if you want to check out the different reg native storage options and the first one is probably the most popular react native mmkv the fastest key value storage for react native 30 times faster than async storage so this is based on tenzen mmkv which is used as far as I know in WeChat applications and it's really really fast it has bindings to the native C plus plus libraries I'd really love to see that code and it is just unbelievable fast it is also supported by stream which is a service I used before really love it for creating uh chat applications and if you check out the Benchmark we see async storage hiroko that's really slow and then we got sqlite we got what is this this is realm then we got watermelon and then we got mm KV so it is really the fastest solution for storing your uh data the API is also pretty straightforward as you can see right here everything is very easy to set up and use in your application and again you will benefit a lot from the speed so if speed is critical for storing and retrieving data in your application check out react native mmkv and the second cool kit that we should talk about is watermelon DB so this is an interesting database which is very popular if you check out the Stars here on GitHub and it basically sits on top of sqlite but makes things a lot faster it is offline first but offers some sort of backend sync that we're going to talk about in a second and it's also reactive using our xjs so if you like that or not I think actually it's great so once again this is focused on time on real world performance when you start scaling to thousands or tens of thousands of database records your app will be slow um and watermelon fixes it by being lazy it's an interesting approach again it is on top of sequel light and if you check out the sync option it is mentioned that watermelon is really just a local database so you have to provide your own backend if you want to implement some sort of sync but it is definitely also possible so we could have put this as well into the remote Sim category however I just wanted to put it to cool kids because it looks a bit unrepresented if you figure out direct native storage packages but it should definitely be mentioned it has even more stars than mmkv so another very very great solution that you could try in your application especially if you're interested in getting the best performance and brings us to the end of our round trip in the react native storage option World we've seen different options we've seen the let's call it basic Expo packages that you can add to your application in like minutes then we have the options with Firebase and realm and couchdb which requires some setup and you really fixed to that servers and then we also had the cool kids you can actually use mmkv on top of async storage so I've seen a lot of people recommend that or use another state management like mob X to manage the state of your application and combine storage and state so everything that we've seen in this video is a great option in a specific case and therefore my recommendation is that you should start by writing down the requirement of your application put down a few requirements do you want to focus on speed do you have a lot of data do you need to sync the data or whatever is a specific requirement in your app and then give one two or three packages that we've seen in this video a try and just evaluate if they work for you because some sometimes you just gotta wipe with those packages like it's not only about the numbers it's also about how you feel using them also a little warning don't over engineer everything like if you only want to store if the user has seen your intro you probably don't need to add Firebase to your application also if you want to store thousand rows of data you probably don't want to use just async storage so find the middle ground between over engineering and two less and you will have a great storage option for your react native app I'm sure you will make an educated choice and one great choice would be to subscribe to the channel and like the video right now so more react native developers can figure out the right storage options for the app and of course check out galaxies.dev if you want to become an epic Stella react native developer I'll hopefully catch you in the next video or stream and until then of course hippie coding Simon foreign

Channel: Simon Grimm

Views: 34,023

Keywords: react native storage expo, react native database, react native data, react native data storage, react native database tutorial, react native store data locally, react native store data, react native store data on device, react native store data offline, react native tutorial

Id: wVNPmxntwKQ

Length: 12min 52sec (772 seconds)

Published: Tue Sep 19 2023