Hybrid App - Ionic vs NativeScript
I am in mobile space for quite some time and we are having native Android and iOS app already. Now our company is planning to enhance our Mobile Site and our team has chosen Angular 2 + TypeScript + Ionic 2. With great difficulty we have completed our registration form development in Ionic + Angular. Now I came to know about NativeScript to develop Hybrid Apps without webview and since it uses the native UI component people are saying that the look & feel and the performance of the App will be good.
I am little bit confused to choose one 1. Angular + TypeScript + Ionic (html, js, css) or 2. Angular + TypeScript + NativeScript (xml, js, css)
Also our company's long term plan is to maintain a single source for both iOS, Android and Mobile Site
Please help me.
Thanks
Answer
This is really subjective question/answer as it depends on how much work you want to do. :-)
First of all in an Ionic / Angular app you are basically making the same web version at the same time (i.e. its a Hybrid app). Performance can be a serious issue depending on what you are doing. Simple screens not so much; lots of data will introduce much bigger performance issues. In addition screen layout will probably cause you the most issues as you are basically coding to a small web browser that has totally different screen resolutions based on each and every device and the OS it is running on. If you are needing closer to native performance; there are things you can do to make Ionic faster (i.e. like using CrossWalk) and overall you can generate a decent web/hybrid app in Ionic.
However the odds are very likely hybrid will never have anything close to Native performance, nor actually act like a Native App as it is still a web app running in a browser trying to act like a native app.
Now, if you are looking for Native performance and/or the ability to do things native on the device, then using NativeScript might be the better choice. You get the native performance, and access to all the native controls (i.e. things like real ListViews that can handle thousands of complex items with no slowdown) -- but the cost is that you DO have to create two separate screens and separate css for your app.
If you use Angular or VueJS; The actual logic can be shared between both a NativeScript and your Web app. And there are now several excellent ways to do this like xPlat (Angular code sharing platform). But in all of them the screen generation is still different. So for your web component/screen you might have a web mycomponent.html -> <div>{{somevalue}}</div> and in NativeScript Angular mycomponent.html -> <Label text="{{somevalue}}"></Label>. So you end up with a more upfront work in NativeScript as you have to create the two separate screen layout files. This might seem like an issue; but in reality this allows you to actually have the native mobile version laid out much better for a Phone and/or Tablet screens. The also opens up additional options like maybe real time access to the camera in the NativeScript layout, and a upload image file button in the html version.
As someone who has used both technologies, I'm firmly in the NativeScript camp for all my new projects; but for some people there are still some valid use cases to use Ionic/Phonegap/Cordova. If the app is already web based and/or nothing that really needs any complex views and/or lots of data shown. In fact the open source xPlat platform that nStudio offers, has support for both Ionic and NativeScript targets. So that you can code share between all the supported platforms and make the best choice for your company at all points in time.
For example; maybe you start with the Ionic/Web build because overall they are basically the same thing. Down the road with xPlat code sharing, you can easily phase your mobile part of the app to Nativescript when you finally do have the extra man power/time and/or need the better performance.
Please note NativeScript w/ Angular allows code sharing; in addition if you are a big VueJS fan, NativeScript w/ VueJS also allows code sharing. So their are two excellent ways to do code sharing between your website and your NativeScript app depending on what your company already uses while keeping native performance for your mobile application.