(Note that below when I say “Native” I’m referring to Java and when I say “React Native” I mean React Native, for those who might be confused by my wording).
I’m migrating my personal Native Android App (in Java) to React Native and here’s how I feel so far:
Positives:
- Using and styling components (buttons, labels, text input etc) is much easier in React Native. You use a somewhat modified html-like/css syntax vs having to write lines and lines of verbose code to achieve the same effect in Java. For instance I decided I wanted a ScrollView vs a View and just changed the code from <View style={styles.container}></View> to <ScrollView style={styles.container}></ScrollView> and it worked. I had some trouble when I first made this app in Java with my scrollview that took a few hours to debug but it was a while ago so I don’t remember the exact issue.
- Performance is not bad. I wasn’t expecting React Native to perform that well but there’s not much of a difference in performance. Granted my app is not data heavy so that could be the reason.
- Cross-platform. The main appeal is to be able to reuse code for Android and iOS. My friend is dealing with the iOS part as I don’t know anything about iOS development but so far we haven’t had any issues.
Negatives:
- If you are adding any Native Modules prepare for hell. I just couldn’t be bothered to convert my more complex string parsing logic from c++/java over to React Native (though I might have to in the end to make the iOS side work…). This meant I had to jump through some hoops to get the native modules to work.
- React Native calls Native Modules asynchronously and will only take void Native methods which means you need to use promises to get your values back. This means doing some back bending like wrapping a JNI-C++ method that originally returned a double into a void Java method and resolving the promise in the Java method.
- The docs as of React Native 0.48 are also pretty bad and I had to figure some stuff out through pure accident/trial and error. For example, to return an array from Java to React Native I needed to use a WritableArray, push values into the WritableArray, then promise.resolve the WritableArray. I figured this out by accident using Android Studio’s code completion. (If you’re having trouble with Native to React Native array returns I wrote a Stack Overflow thing about it here How do I return an array from a Java module in a React Native Component? )
- Async calls to Native modules = async hell in React Native (javascript) too. Thankfully React Native supports async await but even then, the javascript async function that calls a Native method needs to be given a callback to take the value from said javascript function (unless you are updating a state variable in the async method). This results in some unexpected behavior if the async calls aren’t managed well and the code moves on without you getting the values you need. If using callbacks you can do the typical do-everything-else-you-need in the callback to avoid things falling out of order but it doesn’t look or feel very pleasing.
- Typical issues of javascript being too forgiving and thus unhelpful. For example if you input too many arguments by accident. There’s no “neither this function nor its overloads takes this amount of arguments” errors. Just strange behavior.
- Debugging React Native is pretty difficult. I tried and failed to attach it to Chrome so I’ve been debugging using React Native’s “Alert” component, just inserting pop-ups to make sure methods were called. In contrast Android Studio will let you step through your Java code line by line whether using the simulator or a device.
In summary: Yes it’s worth it because component usage is simplified heavily and if you aren’t trying to attach your app to existing Native modules it will come out mostly clean. Performance doesn’t seem to be an issue. The code will work in both Android and iOS with some minimal Java/Objective C code in each. If you can somehow get the debugger to work it would be even more worth it.
