Lost in hybrid app frameworks like Ionic, Cordova,

Question

I'm currently lost with all these hybrid mobile app frameworks. They all sound awesome, but I can not find any real information about the use cases and main differences.

Can someone explain them to me or provide me with great ressources, especially about the use cases?

I know of these ones: Apache Cordova, Ionic, PhoneGap, Steroids (AppGyver), Supersonic (AppGyver), React Native and the new Microsoft Ace (http://microsoft.github.io/ace/).

Disclaimer: It's possible that I mix them completly up and they don't have anything to do with each other, because I'm so lost.

Answer 1

I've been researching this very topic for at least a couple years now and have been wanting to write up a thoughtful blog post summarizing what I've learned, but it never seems to reach the top of my priority list. I'll provide a short summary here.

The Three Classes of Hybrid Apps

1. Hybrid via Webview
2. Hybrid via Cross-Compiled
3. Hybrid via JavaScript Core

---

NOTE: I'm sure there's are better names for the above, but this is the best I'm coming up with at the moment.

---

Hybrid via Webview

Typically, these are the cordova (aka phone gap) based apps you mentioned above such as Ionic, TouchstoneJS, Meteor, and AppGyver Steroids. In fact, Steroids is built on top of Ionic if I remember correctly. These apps attempt to solve the hybrid problem by mimicking native-like components (buttons, list views, drawer layouts, tab views, etc) using standard web-based technologies (html, css, javascript). To access the devices native components, they use a bridge called cordova, which exposes a javascript api to native components such as camera, gps, location, vibration, etc. This is a robust community and if you need access to a native component, you're likely to find a cordova plugin that will meet your needs. The challenge for these types of apps is and has always been performance. Because they render the entire app in a WebView (basically a fullscreen browser window without the chrome), it only has a single thread to render the entire page plus execute any animations etc. In the end, because the components are close, but not quite like native components, and because performance is close, but not quite as slick as native performance, these apps tend to fall somewhere in the uncanny valley. They sort of look and feel right, but they never really are.

Hybrid via Cross-Compiled

Examples of these would be Appcelerator's Titanium and Xamarin. These apps tackle the hybrid problem by abstracting native apis into a common language. For Titanium, that language is JavaScript. For Xamarin, that language is C#. So to write an Android, iOS, Windows, and Desktop app in Xamarin, you'd write all your code in C# using their abstractions (APIs) then cross compile them into actual native apps. These approaches have the right idea, but many would say they fall short when it comes to actually implementation. Though personal experience with Titanium, I found actually building an app was quite painful because you're dependent on their abstraction. If there's a bug in their abstraction layer, you're stuck... until they fix it.

Hybrid via JavaScript Core

There are only two examples of this that I know of, Facebook's React Native and Telerik's NativeScript. This is the future of mobile application development in my opinion, and if I were you, this is where I'd focus my energy. Both of these attempt to solve the hybrid problem similarly in that in each case the developer ultimately writes JavaScript to create native components, but each takes a very different approach. React Native translates your JavaScript to Native through the RCTBridgeModule, whereas Native Script gives you direct access to native apis through some clever trickery in the JavaScript Virtual Machines. I've not worked with NativeScript yet, so don't know how mature or performant it is. I installed their example app and it felt a bit sluggish to me. I think one of it's coolest value propositions is that it literally gives you 100% access to native APIs (mind blowing!). I have worked extensively with React Native this past year and I am super impressed. Both are still very young still and will certainly mature.

Useful Resources

• Slideshare Compare/Contrasting NativeScript, React Native, and Titanium
• Youtube Building native mobile apps with Angular 2 and NativeScript
• How NativeScript Works
• Bridging In React Native