Recently there’s been much fuss about Native Apps vs. PWAs vs. Hybrid Apps and so on. This discussion includes more then one option for featuring your application to mobile users, and involves a lot of questions.

Making the jump from building a website to the realm of building a mobile application, or from building mobile application a year ago to building it today, means making some base level choices that will change everything.

This post will try to help you in selecting the right path, so that you will build the right application for your mobile users. We will review and compare 4 possible solution you will have to choose from before building your app:

Native app

Hybrid app

Native compiled app

Progressive web app (PWA)

We will try to compare them and find which one is best suited for your next mobile app, to help you understand how to make the right choice. Later on, it will make all the different in the world.

Suggestion: When building more then one app, you can share and reuse components to build faster. Try Bit to create a component collection, share with your team and build with your components like Lego. It’s free.

Let’s get started with a short review and then compare the different options to help you choose the right one for your needs.

Native Apps

The first tutorial that you may encounter when you Google ‘How to make a mobile app?’ will probably teach you how to make a native app.

A native app is the most widely used traditional way of making apps. Here you make different apps with different codebase to target different platforms.

General steps to make a native app.

Learn Java/Kotlin -> Download Android Studio -> Write code -> Build&Deploy Learn Objective C/Swift -> Find a Mac for Xcode -> Write code -> Build&Deploy

Google develops and officially supports the Kotlin programming language, whereas Apple supports and develops the Swift programming language.

Hybrid apps

If you know how to make websites using HTML, CSS and JavaScript, there is a shortcut for you to make mobile apps quickly with a minimal learning curve. You can convert your responsive websites into mobile apps with the help of a tool called Cordova.

Previously known as PhoneGap, Apache’s Cordova is a mobile application development framework that embeds your HTML5 code inside a native WebView on the device. Cordova acts as a wrapper around HTML/JavaScript code and provides a bridge to access device hardware and functions of the device. These functions are exposed via a unified JavaScript API, allowing to easily write one set of code to target nearly many devices.

If you make websites using frameworks/libraries like Angular, React, Vue, etc, there is a framework called Ionic which is based on web components(in the latest 4th version) and has styled components based on the design guidelines for iOS and Material Design for Android. One cool thing about this framework is that you can write your app with one codebase but while compiling for a specific platform, it chooses the appropriate styles on its own.

Compiled to native

The hybrid approach may not be the best path if you want to make a very performant application. So, if you want native-like performance and the flexibility of hybrid app, you can try React Native and NativeScript.

The UI, components, API logic of these apps are written in a JavaScript-like language and compiled to Java code in case of android and Swift/Objective-C for iOS. These packages know the translation or the respective native counterpart of the components used. Components made in Native code(Java/Swift) can also be integrated with these apps.

Google’s flutter utilizes Dart programming language and this gets compiled to ARM C/C++ library. Compiled apps provide better performance that hybrid apps because the WebView wrapper is absent in this. But on the other hand, usage of a myriad of JavaScript libraries is not possible with this approach.

Progressive Web Applications(PWA)

Flipkart’s website is a PWA

You must have come across a site that has a banner at the bottom asking you to ‘Add to home screen’. These are not real apps, but websites that behave like an installed app, also called Progressive Web Applications.

Like a typical website, PWAs are hosted on a server and distributed using URLs instead of app stores. A PWA is found by the users using search engines.

They utilize a technology called Service Workers which allow the website to work offline. Service Workers allow to cache the website on the device and provide an icon for the bookmark created on the device.

Google has provided a checklist which lists down the criterion for a website to be called a PWA. Native device features supported by modern web browsers like camera, audio recording, video capture is the limit for such apps.

Comparison

Benchmarking technologies for building mobile applications depends on a lot of factors like the application tested, the device used, the ratio of lines of code to errors, development time, etc.

The best way is to make a relative comparison based on the general pros and cons of the underlying architecture design of the technology.

From the viewpoint of developers, aspects including ease of coding, debugging, distribution and upgrading work are usually emphasized.

Let’s use the following criterion to evaluate the application development techniques, and hopefully make a better choice for your mobile app.

1. Write once use everywhere

Native apps require you to develop and maintain a different codebase for different platforms. Java/Kotlin is used to develop android apps and Objective-C/Swift is used to develop iOS apps. On the other hand, compiled, hybrid and PWA support reusability of code.

All of them use web technologies like HTML, CSS, and JavaScript to make the app. Compiled apps may still require to maintain separate branches if the components are styled to adhere to platform specific design language. Hybrid and PWAs support the maximum amount of code reusability.

2. Learn once apply everywhere

The technologies and the concepts involved in the programming languages used to develop Native apps differ in great amount. Learning to develop apps using web technologies will eventually set up the foundation of developing Hybrid, Compiled to native and PWA.

This reduces the time required to learn different programming languages and their usage for different mobile platforms. The added advantages of the latter approach are that it allows to develop for the web and existing web developers can undergo a smooth transition into app development.

3. Ecosystem and community

The most important part of any tool is its community/ecosystem.

Since native mobile app development was the first approach, its ecosystem has grown to a substantial amount over time. The availability of beginner-friendly tutorials, pre-styled components, guides and community support from other developers is very good. All the other approaches have comparatively lower support mainly because these technologies are too young.

Hybrid applications and PWAs are effectively websites delivered in the enhanced format, so, most of the JavaScript libraries that are used for developing a website can be used in the apps.

Compiled apps cannot use all the JavaScript libraries available for the web since their corresponding compilation to native device code may or may not be available. The popularity of an approach/library also plays an important role in the availability of community support in the form of third-party libraries.

4. Performance

This is generally considered as one of the most important metrics that developers cannot ignore since it affects the number of users of the app and the retention rate. Native apps have the best performance because of the optimizations available which running on the device.

React Native(compiled) also has good performance since the components related to UI are native in nature. Flutter(compiled) has better performance than React Native because of the underlying architecture which compiles the code firstly to ARM C/C++.

Hybrid apps have the least performance since they work inside a wrapper which interacts with the device hardware. Considering the power current devices have, the low performance of the hybrid apps is relative and not experienced with basic to moderately complex apps.

5. Accessibility of features and device support

Device features like camera, flashlight, gyroscope, accelerometer, NFC (Near field communication), etc. are used by mobile apps to provide advanced features. Apps developed using Java/Kotlin/Swift have the highest access to most features.

Apps made using a Cordova wrapper around them and compiled apps have limited access to device features. PWA has access to features that modern HTML5 supported browsers support. If the app being developed used advanced device sensors like the fingerprint, NFC, etc. then PWA fail to provide such features.

Google and Apple release a new version of their operating system approximately every year. Along with the OS, a new API version is released with more features to make apps that target the latest version. To target several devices, the apps developed also need to be backward compatible with older versions of the OS.

These APIs are released directly for the native development method. Using these new features in apps made using Cordova or compiled apps like (React Native) is not possible until a wrapper, in case of the hybrid, and translation code, in case of compiled apps is released.

A summary of our comparison

Conclusion

Looking at the above table, we can summarize in a few points:

Choose Native if performance and access to device hardware features are important.

Choose PWA if you are making an e-commerce website+app.

Choose Compiled or Hybrid if you and your team are comfortable with web technologies and want to build apps in a limited time.

Flutter looks very promising with easy styling, great performance, and Google’s backing.

PWA has the highest reach with companies like Flipkart, Twitter Lite and Starbucks reporting increased user retention rate.

Thanks for reading! Feel free to comment, ask anything and drop a few 👏 if you liked it. Cheers!