Comparing Native vs Cross-Platform vs Hybrid vs PWA Mobile Applications

There are many options to consider before building your next mobile application. In this article, we break down the differences between Native, Cross-Platform, Hybrid and PWA mobile applications and which ones we prefer based on the use case.  

Native Mobile Apps

Native mobile applications are built using code that is native to the device in which you are building it for. This means if you are building an iOS application, then you would use either Objective-C or most likely Swift programming languages. In the case of Android, this would mean you are using Java or a variant of such as Kotlin.

When choosing to go full on native you have optimal power of the device at your control. So if you are building games or applications that rely heavily on 3D rendering, you'll get the up most performance by going native.

On of the biggest complaints to building a fully native application is that you have to build two separate applications. First, an app for iOS and a different application for Android. This not only drives up the cost of building your application but makes the maintenance of keeping two separately applications update to date costly. So really scoping out what type of application you are building is super important.

Native App Pros

• Performance. A must for building games or 3D heavy applications.
• Full access to the underlying device hardware based on the Native SDK's.
• Customization. Customize the UI for each platform.

Native App Cons

• No Code reuse.
• Slower development time. Creating separate apps takes time.
• Costly. Multiple apps must be built and maintained.
• Can only be used as a mobile application.

Cross-Platform Mobile Apps

Cross-platform mobile applications are built using very similar technology as hybrid mobile applications. Much like hybrid apps, they use a bridge that takes the language in which the application is written and allows it to run on any device without having to rewrite separate applications (for the most part).

The primary reason people choose to write cross-platform mobile applications - is that they can use the language they are most familiar with.

If you're a C# guru, you could choose Xamarin. If you're a JavaScript junkie you have a few choices. You could choose React Native, NativeScript or something like Appcelerator Titanium. And if you're keen on Dart, then go with Google's latest project, Flutter.  

No matter which language you choose, they all use the same technique behind the scenes. So if you write your code in JavaScript/TypeScript, then at runtime the code calls into the native SDK to render the UI elements.

While code sharing between platforms can be high (via shared libraries). If you need to modify functionality that isn't supported by the cross-platform SDK, then you'd have to find plugins to accomplish this or you would need to dip your toes into the native code. Depending on your teams skill set this could be a non-starter.  

Cross-Platform Pros

• Code reuse. Business logic can be reused across platforms.
• Speed of development. Definitely faster than building two separate native apps.
• Skillset reuse. Developers use the same language they already know.

Cross-Platform Cons

• Not as flexible when it comes to modifying the UI elements, without getting your hands dirty.
• Reusability of UI elements across platforms.
• Performance can be an issue, depending on your application design and use case.
• Can only be used as a mobile application (exception is maybe Flutter).

Hybrid Mobile Applications

In many ways, hybrid mobile applications are similar to cross-platform mobile applications. Both use a bridge to take code written in one language and allow it to run on any device.  You can write your code in a single language (JavaScript/TypeScript) and depending on the device it is running on, the UI can be rendered to look as it should.

Unlike the bridge that React Native uses, Capacitor, Cordova, and PhoneGap, all use a WebView to run your application. Essentially, you can use all the native features available in the web browser that is running on the device itself.

Running in a WebView has a ton of positives. We find it much easier to reuse talent you already have on your team. Being a single codebase that works anywhere means you can reuse your mobile application code on the web or as a desktop application using Electron.

This is the beauty of using something seamless like Ionic Framework.  When you write it once, it runs everywhere. For example, when your app is running on iOS, it follows the Apple Human Interface Guidelines and when it is running on Android it follows Google's Material Design standards.

When it comes to customization, anything you can do in a web browser, you can do inside your cross-platform mobile app. If you don't want to follow the iOS and Android UI standards and instead want to create something truly unique that runs on both platforms, you can do so easily with the right skill set.

Hybrid App Pros

• Speed of development. In many ways it is faster than cross-platform frameworks like React Native.
• Single codebase. The ultimate in cross-platform code reuse.
• Reusable.  Reuse libraries and design systems you already have in place.
• Familiar. Web developers can use the same technology/language they already know.
• Customization. Edit the UI until your heart is content.
• Deployability. Run it as a web, mobile, or desktop application (using Electron).

Hybrid App Cons

• Performance can be an issue, depending on your application design and use case.
• Access to new device features will require native browser or plugin support.

Progressive Web Applications

Progressive web applications (a.k.a PWA's) have become their own movement. They've slowly gained traction over the last few years as browser vendors have adopted features to power PWA's.

The beauty of a PWA is that you don't have to build multiple applications and much like hybrid applications, you can run from a single codebase. With access to device hardware features like, geolocation, push notifications, accelerometer, offline mode, and more, for most apps, this is all they need (see what all it can do).

Not only is it a time saver when it comes to development, in many cases it allows you to take an existing codebase and modify it to work as a PWA. Pinterest rebuilt their mobile web experience using React, Redux and webpack and shipped a solid PWA in under 3 months.

Many companies have started to invest in building robust PWA's applications along side their native applications. Here are a few examples: Twitter, Starbucks, Google News, and many more.

Not only do PWA's see increased user engagement with their mobile website, they have better capabilities to reduce data usage for people on slower devices or with poor connections.

Having a PWA is a great idea for many use cases where it makes sense. If you are small size company or a solo entrepreneur with minimal IT resources, creating a full blown mobile application might not be feasible. However, if you can live with the limitations inherent to PWA's, taking your new or existing website and making it into a PWA might be your best alternative.

PWA Pros

• Speed of development.
• Single codebase and possible reuse of existing web infrastructure.
• Deployability. Ship updates without the app store approval process.
• Optimized for SEO. Since it is published like a website, you can use search engines to your advantage.

PWA Cons

• Not a true mobile application.
• Performance. You are limited by the device hardware.
• Does not have full access to the device hardware API's.
• Getting your PWA into all the app stores can be challenging (We're looking at you Apple).

Conclusion

With so many options to building mobile applications, developers need to stay abreast of emerging technologies. Knowing why a particular type of app is popular is just as important as knowing the drawbacks of each approach.  

In the future, we think cross-platform and hybrid apps will continue to get closer to the speed of native applications. We look forward to new technologies, like WebAssembly, which promise to play a big role in closing the gaps between true native apps and everything else.

At Tevpro, we are big proponents of building for the web and love writing apps in JavaScript and Ionic Framework. If you are having challenges navigating which path is right for you, we would love to hear more about your use case.

If you like our content and want more tutorials, sign up for our monthly newsletter below. Or feel free to reach out to us on Twitter or via email with any questions.