I don’t track this stuff very well, but I get it. If you want a native app for Android and iOS, it sure would be nice to only have to write it once rather than two very different languages. Roughly double your reach without doubling the work. More and more of these things are reaching into desktop as well, meaning three targets for one.
Stuff like PhoneGap comes to mind. They say, “Reuse existing web development skills to quickly make hybrid applications built with HTML, CSS and JavaScript.” That’s obviously compelling for web developers who would have to learn minimal new things. My brain leans more toward, “Well if I’m going to write this thing in HTML, CSS, and JavaScript, why don’t I leave it at that?” Progressive Web Apps are doing great things. Still, I’m curious what the flagship PhoneGap apps are. Do I use any great ones and not even know it?
If you’re going to layer on a framework, but still stay in JavaScript-land, I’d think the biggest player is React Native. I hear it’s almost always used with Expo these days, which apparently has a thing to help React Native work on the web. Plus, there is literally React Native for Web.
In React-land, there is another new player: Ionic React. It targets all three platforms (iOS, Android, and Desktop) right out of the gate. Ionic isn’t new though — it’s long been a framework that does this in JavaScript (alternatively in Angular) and is apparently coming soon to Vue. Compelling. Nader Dabit has a first-look blog post that is pretty well done.
This all starts to get confusing to me as apparently Ionic ultimately uses Cordova under the hood… just like PhoneGap does? Or something? But now Ionic is moving to their own thing? I guess it makes sense that there are some low-level interpreter things that translate web primitives to native primitives and that people build developer tooling on top of that.
Google’s got a stake in this game with Flutter. Flutter is about hitting all three targets and helping you build the UI. Material design, animation and performance are all first-class citizens. It’s all in Dart though. Dart can compile to JavaScript (so it can be used for web stuff) but it also compiles to machine code. I imagine Flutter apps are compiled that way when they become native apps for bonus performance. I don’t have a good sense of how popular Dart is, but I’d assume web developers really won’t care what they’re writing in if great performance on all three targets is the outcome.
Ever further outside my wheelhouse is Xamarin, which is Microsoft’s take on unifying development on multiple platforms. The languages involved here are .NET and C#. It has all the same promises as everything else: build with this and it works everywhere! This is for developer convenience! It’s fast and you will make amazing things with it!
I’m always of two minds with all this stuff. Some part of me is envious of really nice native apps. Most of my favorite apps on my phone feel very native, although I’m not sure I could spot which framework created them, if any. For example, I have a Dribbble app on my phone and I quite like it. It’s simple and nice. I open it up and I’m logged in, which is usually not the case when I open a web app. It feels fast and has all the in-page animation stuff you expect from a native app. I totally wish we had an app like that for CodePen. Maybe if we were starting over today we’d write it in some cross-platform framework that targets all three platforms and maybe gives us some cool competitive advantage. Another part of me is like, meh, I’m a web guy on purpose. I think the native open web is the place to be and has the most longevity. A codebase that serves that well will be the least regrettable over time.
Yesterday I was gathering stuff in order to prepare a talk about Service Workers. I naturally went to Codepen to see if it has one, because it would have been super awesome.
I used to be jealous of native apps but now I actually feel privileged that with JavaScript knowledge there are all these tools that let you build apps on all the platforms with just JavaScript because we’re actually getting more value than a natively built app because we can build one codebase and put on all platforms. Efficiency and not repeating. Isn’t that the essence of code anyway.
I’ve just started using Electron which lets you build cross platform desktop apps in JavaScript and I’m ecstatic by the results. Especially when I found out Slack and Skype were JavaScript apps built on Electron as well. We built a mac os app in JavaScript. Now I can see the similarities in the app we built and slack.
Now that I’ve dipped a little more into this ocean I honestly feel like this should honestly be the ideal way to code. One codebase distributed on multiple platforms is actually the most efficient method. And this makes JavaScript king again with regards to it’s portability and versatility. I love being able to ship a native product on Mac os and windows just using JavaScript.
And truthfully I think doing it this way lets you as a developer focus even more on how do you make an app intuitive, accessible and user friendly and quit focusing on the technical aspects. The app isn’t good because it’s native. There are plenty of garbage apps written in native languages to the platform. The app is good depending on how you build it.
It seems to me that the platforms themselves should really consider creating a way for developers to build using JavaScript without having to resort to a framework.
Certainly depending on how much functionality you may need to go native but a lot can be done with JavaScript. I’m super greatful for these frameworks that have extended JavaScripts reach.
You forgot to mention https://www.nativescript.org/ which is also very promising. But right now I would say Flutter is the most promising framework
It’s a complicated landscape for sure! Here’s my explanation (and I know I am oversimplifying some of it).
Afaik, Ionic does use Cordova under the hood, regardless of whether you use Angular or React. They are building their own Cordova-like solution called Capacitor, but I last I recall that’s not what they use by default yet https://capacitor.ionicframework.com/. The key difference here is that these solutions (called hybrid) all render in the WebView. This means that you can build the UI with HTML/CSS, which is great, but it also comes with some limitations and performance considerations.
On the other hand there are tools like React Native and NativeScript. These tools actually render native UI on iOS and Android, but under the hood they use JavaScript running in a packaged JavaScript VM to do all the business logic. The benefit is native UI controls and better performance over hybrid, but the drawback is a steeper learning curve and you have to learn a different UI HTML/CSS. The key differences between the frameworks is largely the frameworks – React for React Native and Angular, Vue or no framework for NativeScript.
Xamarin and Flutter fit into a different category as they are both, to the best of my knowledge, cross-compiled. Xamarin takes .NET and converts it to native iOS and Android. Flutter does the same but using Dart. The benefit here is, in the case of Xamarin, using a language you already know and, for both, you get true native performance and UI since the code is, in the end, native.
For full transparence, I used to work for Progress, who is behind NativeScript, but I believe this is an unbiased overview. Also, I co-edit Mobile Dev Weekly, where we cover much of this https://mobiledevweekly.com/
Hope that’s helpful.
Yes, that was the helpful :)
Flutter is not crossed compiled, it just draws anything UI related from scratch using the skia drawing engine, on both android and iOS.
Thanks @Omar. My mistake.
It feels like an uneducated pipe dream to me.
The web has concerns that are not replicated on Apps, like semantics, accessibility concerns of the DOM tree, etc.
I don’t see a way for a software to deal with all the hidden text, skip links, tab order navigation we do on the web while also making it work on native app environments…
Hi Chris, if you also have some enterprise developers in this audience , they may like the deeper dive taken on platforms like Xamarin, Telerik, Alpha, Kony . These days there are more and more mobile apps being built for enterprise operations and even end customers using enterprise platforms for a common developer experience:
https://www.outsystems.com/blog/posts/enterprise-cross-platform-mobile-app-development-tools-compared/
For full transparency, I work for OutSystems but not Stanley or Gartner of the 1.000s of customers doing Peer Reviews where some of the links are provided, so it may help others :)
Chris, you nailed it with “I think the native open web is the place to be and has the most longevity. A codebase that serves that well will be the least regrettable over time.”
Ionic is 100% focused on the open web: Pick your JavaScript framework of choice (or vanilla!) and start dropping in our UI components immediately. When you’re ready to deploy the app to mobile, desktop and beyond, you use Capacitor, our modern native app runtime. Ionic apps are web apps – there’s nothing custom or proprietary to learn, meaning web devs are comfortable getting started as sticking with us – knowing that these skills will serve them for a long time to come.
(Disclaimer: I work for Ionic.)
Hey Chris I believe the best example of a cordova/ionic app is Untappd.
Untappd was originally built using cordova without Ionic for the UI. At some point they started using ionic for the UI (it has always used cordova though). I think they might be making the move to react native now though.
My preference is the web and I have about 7 years of experience with cordova and a few years of experience with React Native.
I believe that Apple has intentionally prevented the mobile web experience from progressing so that they can capitalize on the app store and their own controlled ecosystem. If we can just get push notifications and touch/face ID support in the browser then there really won’t be a need for most hybrid apps anymore.
Long story short I think the web will win.