How to Take a New Step in Cross-Platform Development?

Personal Experience of Transition from Ionic/Phonegap to React Native

I would like to share my experience of transition from Ionic/Phonegap to React Native. This path was very difficult, but it was worth it. First, it is better to share my work experience with Ionic/Phonegap. My encounter with it started from the 3.6.0 version at the beginning of 2015. There were almost no other alternatives in cross-platform development back then, moreover, this platform gained momentum and popularity very quickly.

What was such surge in popularity connected with?

I think that the main reason for this was the possibility to turn rather quickly from the web development to mobile development, as it wasn’t necessary to learn any new markup or programming language. Work experience with JavaScript and HTML was needed. Having some brief work experience with these technologies I’ve received the first project based on such frameworks as Angular and Ionic. Both are derivatives of JS and HTML, and it is rather easy to master them. At first, there was bewilderment! Well imagine, it seems you’re building the website, and then it turns out to be a mobile application.

Time went on and the projects changed from time to time, but the platform for development didn’t change. The problem was that there was always a question of performance and that, after all, it is not a mobile application in a pure form, but it’s just a small website in some special browser. The resulting effect in different projects was always approximately the same — the application worked, but it felt slower somehow than native applications. It was necessary to use different tricks like CrossWalk. We added browser to the application and that gave a certain surplus in performance while working with Android OS with a version lower than 5.0. In result, the application increased in sizes from 5 MB to 45–50 MB. And it was quite difficult to explain this change, first of all, to the customer. Also, some other tricks were used, but all the same the application never felt like a native one.

What happened next?

In the spring of 2016 when after the end of another project a question of my further development arose, I received a new project that had to be developed with React Native. At first, it was hard, then it was even harder. The transition from one platform to another was very difficult. In comparison with Angular that I used for application development earlier now the volume of the written code has increased by 2,5–3 times. The probability of mistake appearing has strongly increased with this circumstance. I could never stop thinking that with the old platform it was possible to finish the project a lot faster and forget about it already.

Constant mistakes in the form of red and yellow windows caught sight. And, if yellow were just an eyesore, then the red ones stopped the work of application completely. Earlier to improve the user interaction in Angular loading screens have been introduced in order to prevent the user from errors in the middle of an important process. Sometimes such screens just blocked the user’s work when code misoperation appeared and it was the main problem. Now in React Native any typographical error or an unreasoned code simply close the application completely. Over time we have found how to work with such mistakes, but at first constant failures in operation of an app awfully irritated all — from the developer to the customer.

What was next?

After a month of working with React Native, there was a certain understanding of how this platform works. After two months the application has already contained a decent number of screens and at the same time, still a failure could happen in the most inappropriate moment. During the third month, the application worked more steadily and, moreover, looked good on iOS devices (a month before the development for Android).

Why haven’t we developed the app for Android along with iOS?

Because we needed to lay out the version on AppStore first. As a result, the version for Android became secondary. The first gleam has appeared when we started to test the application on iPhone 6. It has turned out that it works quickly and is felt like a native one. After a number of applications developed on Ionic/Cordova, it was extremely pleasant to use the application on React Native. All the elements of the page were native and felt native. Transitions between pages were very smooth. That is important because earlier to make that happen we needed to work a lot with Cordova/Ionic, now there are no problems with this. The belief in React Native has finally amplified when after the first launch on the Android device (the old Lenovo S920 with the 4.4.4 version). After the week allotted to work on the version for Android, the application worked from the first launch on the real device, moreover, it worked very quickly. No device worked so well with all possible tricks on Cordova/Ionic. It is clear, that there were small defects in a layout in comparison to the iOS version, but they were minimum.

It is worth noting that as a result of long months of development the application, after all, worked quickly and it felt like closer to native than the one on Cordova/Ionic ever has before. The understanding has come that the time for development that increased by many times has been spent for a good reason.

Conclusion

In conclusion, I want to tell that yes, Cordova/Ionic try not to yield to the competitor and issue native variations. But nevertheless, the fact that applications based on Cordova/Ionic are launched in the browser, after all, is the main weak link braking system.

And yes, it is simpler to develop on Cordova/Ionic. Therefore, this platform, certainly, should be used for small projects. But, nevertheless, the conclusion is drawn!

There is no desire to return to Cordova/Ionic after React Native.

If you liked this, show your support by clapping us to share with other people on Medium.

Follow us on Facebook, Instagram, LinkedIn, Behance, Medium and visit our corporate blog for more news and articles on smart solutions.

Any questions? Feel free to contact us!