
React Native is a fairly new technology that at first glance seems like a silver bullet for many novice developers. In the article I want to dispel this myth and tell what exactly is wrong with React Native and why you should wait before using it.
And so in order, I'm a full-stack developer. I use the latest javascript standard on the front and back end. There is no experience in developing mobile applications, but there are 5 years of experience in developing high-load projects at node.js, asp.net mvc. I decided to try React Native while creating a simple mobile application - the LessPass client for Android.
A bit about
LessPass . This application is a password manager. It does not save passwords, but each time it calculates the password using a clever hash function that accepts the site address, your login and master password. Thus, the MVP version of the application is just one screen, with three input fields and one button - to generate a password. Well, the introductory is finished, let's move on to programming.
Layout of the main screen
Layout in React Native is similar to what is now on the web. From the basic requirements - knowledge of flexbox. the grid of the mobile application is based on it. In order to use beautiful components in your application, you need to put
React Native Elements . Differences from the usual browser layout exist, albeit not significant, but they are, for example, sometimes an element does not have properties that you expect it to see. There are no usual divs and spans. Often you have to read the React Native Components Guide in order to understand what is inherited from and what features are in a particular platform. Minuses are small, you can put up with them.
')
Example of layout for React Native:
<View style={styles.inputView}> <FormInput inputStyle={styles.inputStyle} placeholder={'Site'} keyboardType={'url'} underlineColorAndroid = 'transparent' onChangeText={(value) => this.setState({...this.state, site: value})} value={this.state.site} /> </View>
Business logic
The business logic of my application consisted of exactly one function - counting a password by given values (site address, login and master password). Moreover, this function has already been implemented in
the lesspass library node.js. I decided to do the usual
npm install lesspass
. The library did not work, because its work requires the node.js base classes such as Buffer and Stream. A browserify immediately came to my head, which is able to make browser versions of libraries requiring node.js. But in React Native its use is impossible. As a result, I rewrote the function using cryptojs to encrypt instead of
cryptobrowserify because of this, the password generation performance dropped significantly (60 seconds against 100 ms).
The key point in this story is the following - you cannot use millions of written libraries in React Native. Yes, there is a chance that they will earn, but it is small and you should not count on it. What to do if the required library does not start? Try to find a library that does not use node.js inside. If there is no such library or its performance does not suit you, then you need to write a native component for the platform for which you are developing. Writing native components, in my opinion, crosses out all the advantages of React Native for a programmer unfamiliar with mobile development.
Debugging
The debugging process in React Native is great. Many Android developers dream of hot-reloading, which is already in React Native. Everything is clear and understandable, there are practically no differences from the usual javascript browser debugging. Pleased with the presence of perfomance tools.
Other
The overall feeling of libraries for React Native is negative for me. With a few exceptions, they are all very young and unstable. Installing any of them implies editing of Android Build files. For example, I did not find an adequate library to set up the splash-screen. The library for creating share-menu does not work in the latest version of React Native.
Results and conclusions
In my opinion, React Native is not suitable in its current state for developing mobile applications. The main factor is the lack of quality libraries and children's diseases of React Native itself. If you need to write a complex and fast mobile application, use native platform tools, if the application is simple and does not require complex interactions with the platform, use Cordova. Cordova was chosen as the main technology for the
LessPass mobile application . Creating such an application took 30 minutes, performance is acceptable.
→ The source code of my application on React Native can be found on
GitHubThank you for your attention, in the comments share your experience of developing applications for React Native with links to ready-made projects.