Here’s another piece from our entire React Native articles series. Why to concentrate so strongly on a single topic only? "Is React Native really that special", you might ask? Our aim is to look inside each corner of this young, ‘Facebook-powered’ platform. Now it’s time to make a general summary; see what React Native is all about and what’s the future of React Native.
What is React Native? The birth, history and dates to remember
Have you heard of ‘React Native’? Then you’re probably thinking about Facebook or/and Instagram. That’s right, the very roots of this technology lie inside the Facebook/Instagram devs hub. The entire story has started with React.js library which was released in 2013. The primary aim of this library was to build user interfaces without the need to reload a page when you change anything in the code. Sure thing, React Native pursuits the same feature, but the difference is it was created in 2015 for building mobile native cross-platform apps on purpose. Among the companies who have implemented RN technology (except Facebook and Instagram) are AirBnB, Tesla, Artsy, Vogue. In fact, check RN showcase and the list of open- source solutions powered by RN. Today, React Native is available under the 0.46 version and is in the ownership of the ‘most populous’ social medium. If you’re planning your next project to be built using the current technology, there’s a tutorial database and documentation available.
React Native benefits for business (efficiency, performance, community)
So why is app development branch getting more engaged with React Native framework? The answer is React Native development speed capabilities and flexibility. One of the several React Native great features is combining the framework with native technologies and creating an even more impeccable app as a result. You can also painlessly include the use of other additional React-based technologies, like Redux or Recompose, which boost up app development process.
How efficient is it to use React Native for your app?
The very first and foremost worth mentioning is that React Native is open source, which means anyone can contribute and offer what lacks in React Native functionality. The more experienced devs make React Native better, the more great features your app will get.
We guess some magic is happening here on a daily basis.
When using React Native, you don’t waste time updating all changes. Any alteration is instantly displayed by means of hot reloading.
React Native is smoothly combinable with Native code (Objective-C, Swift, Java). In case your idea is to add more custom functionality or implement some optimization techniques, React Native allows you to get native technology in action.
React & React Native motto states ‘Learn once, use everywhere’. This means that code can be reusable and exploited for building an app either for iOS or Android.
As it was mentioned above, since React Native is an open source project, all related documentation is in free access and open for anyone who’s ready to contribute. If you have faced any issues concerning React Native, you can freely get in touch with the community and experts.
React Native performance
If according to your plan, the application you’re working on won’t contain SFX, 3d projection or any features that require ultra-high performance, you’re free to start building your project using RN.
As RN documentation states, 60 FPS is your lucky number and you should aim for reaching this index. This part refers mainly to the process of creating animations and navigations for the app.
We stick to the following ‘optimization commandments’ when we aim to reach 60fps
Update components using shouldComponentUpdate. Don’t overload your app’s JS thread with small issues you can solve with the help of this lifecycle.
Use the power of InteractionManager, an inbuilt RN functionality which is directed towards making animations and navigations smooth. How? By scheduling the further code execution after animations/navigations are processed.
Use PureComponent to optimize rendering for your application. PureComponent compares the changes inside state or props, and if there are any referenced alterations, it calls the render method.
Don’t create tons of functions and don’t keep much business logic in the render.
Watch this ‘Why 60 fps?’ video by Google to get a clearer picture of app performance priorities.
RN with its unique features significantly boosts up the stage of app development. Efficient apps is not the only result of using the current library. RN makes the devs’ lives easier by reducing the possibilities to apply additional useless actions.
React Native though comes with several drawbacks which we’re going to consider further.
Pros and cons of using React Native for mobile app
React Native architecture as a View Layer
React Native is a View Library aimed to build user interfaces only. Clean RN does its job well enough when we’re about to develop a pretty plain app. But what if you want to add some advanced functionality or change, for instance, app’s overall logic? RN might be not enough. RN is not responsible for the state layer. It’s better to use RN in combination with other native technologies (Swift, Java, etc.), or use frameworks like Angular. Watch out the part where you ‘bridge’ the technologies. If not done properly, the process can result into performance issues.
Since JS is a language that doesn’t have clear organization standards, you might face difficulties when building React Native workflow, especially, if you’re new to this.
Before getting your hands on the creation part, we’d recommend to get familiar with React Native drawbacks and limitations in detail and how to deal with them.
How about planning large projects with React Native? Is it worth it?
If you decide to use React Native for an app which is going to be medium-computed, the recommendation is, again, to use RN in combination with Native technologies. On the other side, take also popular and at the same time complex apps built with React Native+native technologies, like Facebook or WiX as examples.
Security and privacy
- Memory management issues which result into the garbage collection.
var x = 0.1 + 0.2 and you see that the result will equal to 0.30000000000000004)
React Native lies under Facebook ownership. We deeply doubt it, but what if FB guys decide to shut React Native down? Or consider that you want to initiate a lawsuit against FB, then you have no longer a right to use RN. Frustrating, right?
How to be with this entire pile of...um,issues?
As some of our devs say, use Redux and don’t show off :)
Additional technologies, like Redux, simplify the developer’s workflow. Its main advantage is live code editing (you alter something, and changes are instantly displayed) and ‘time-travel’ (you can go back to the initial code state if anything went not as expected). Since RN doesn’t have native routing system, you have to deal somehow with the states anyway, and soon you’ll find yourself in need of Redux+React Router.
Another thing you can implement is Reselect library which is aimed at selectors memoization. Memoization helps when there is a large state tree and you want to avoid repeatable and resource-consuming re-rendering of derived (output) data. This way, the selectors allow Redux to keep the minimal possible state.
React Native app examples
Here's a short list of popular React Native apps in the App Store / Play Store
Visit RN showcase page for more.
How long will it take for a team to learn React Native?
If you’re new to React Native, the very first thing you should do is to get familiar with this technology. You’re going to need:
React knowledge. Consider it as the React Native’s starting point.
If you’re up to learn React Native, you can start from reading the official docs and use this resource: React Native Express. In fact, there are lots of tutorials if you search properly. For instance, there's a Udemy’s course on React Native.
If your team is already familiar with React, it won’t take much time for devs to dive into the things in React Native. A few tutorials will be enough to start writing in React Native. But once again, without knowing React, there’s no reason to start with RN. That’s one of the challenges you can face and this is why people consider this library to have a steep learning curve.
How to hire a React Native developer
Our primary advice is to visit React Native events and communities and meet with the new people who have already worked on React Native projects. The events of such type, like the thematic presentations, show the proficiency level of a person who delivers the speech, sharing personal experience, and who can potentially become a member of your team.
Will Facebook continue to maintain React Native?
As we’ve mentioned earlier, React Native is a Facebook product. The very beginnings of React Native originate from the Facebook’s dev’s department. If you take a look at React Native GitHub directory, you’ll see that for the most part Facebook developers maintain and update the library. We see no reason for Facebook to abandon this technology; but who knows, what if the developers behind React Native would want to make it an independent product? The future is unpredictable if we take into consideration how rapidly React Native is developing. Be prepared to embrace any change.
We don’t live in a perfect world, so there’s no perfect app-building platform. Each technology comes with its drawbacks and advantages. React Native is unique in the way how people are contributing to this platform on a daily basis and trying to make this library smooth and universal in use. How to prove the fact that React Native is different? Just take a look at the number of React Native contributors in Github and React Native’s showcase page.
Found this article useful? Then let us know how else we can be of help ;)