Native Apps, Web Apps or Hybrid Apps? What’s the Difference?

More importantly, which is the most appropriate app type for you and your business? Which type of app should you build? Unfortunately there is no single, definitive answer.

The debate between Native Apps vs Hybrid Apps vs Web Apps is still ongoing, with no clear winner – all three choices have their benefits.

Your choice will depend on several competing factors, including your budget and your deadline. We want to give you a sound understanding of the different types of apps available and to help you to make a smart, informed decision on which technology you should use to build your app.

1. The Basics
2. Web Apps
3. Progressive Web Apps
4. Mobile Apps
5. Native Apps
6. Hybrid Apps
7. Finding App Developers
8. Case Study #1: Building a News App
9. Case Study #2: Building a Social Network App
10. What Kind of App is Best For Your Business?

Here’s a video overview containing the key takeaways from this article:

When talking about ‘app development’, we are usually talking about developing for mobile devices – including smartphones, phablets, and tablets.

There are also apps for the web and wearables like smartwatches, but for the purposes of this article, we’ll stay within the bounds of mobile devices like smartphones and tablets.

More specifically, we’ll be focusing on mobile apps for the two largest and most important mobile operating systems: iOS and Android.

iOS vs. Android

Globally, most people’s mobile devices run on iOS and Android.

As of 2018, Android controls about 88% of the mobile device market worldwide, and Apple owns most of the rest. The number of Android users has grown from 1.8 billion devices in September 2015 to over 2.5 billion today. With more and more of the world’s population coming online over the next decade, Android will keep growing.

But that doesn’t necessarily mean you should develop for Android first. We’ll cover this later in the article.

iOS is developed and supported by Apple and is used only on their own devices, iPhones and iPads.

In other words, in the Apple universe, they control both the hardware and the software. Because of this, they can more closely control how their devices (and mobile apps on their devices downloaded from the iOS App Store) function, which enables them to maintain a loyal user base and a solid amount of market share.

Android is developed and supported by Google, often considered a more open platform compared to Apple.

In fact, Android is an open source operating system, which means that a number of device makers can use Android on their devices. Google sells a few devices of its own, but many Android users are using devices built by other companies like Samsung, Huawei, LG, HTC, etc.

Can iOS and Android apps work together?

Unfortunately not.

There isn’t any overlap between the apps created for iOS and Android. This means that native iOS apps won’t run on Android phones, and vice versa.

Even though you see Snapchat or Instagram, for example, running on both phones and looking very similar, they were actually built entirely separately.

Now that we’ve got the basics, let’s define native, web, and hybrid mobile apps.

Web Apps

According to Wikipedia, a web app “is an application that is accessed via a web browser over a network such as the Internet.”

So how is a Web App different to a Website?

The difference is subjective, but most would agree that a website will generally just be informational and a web app provides additional functionality and interactivity.

For example, Wikipedia is a website; it provides information. Facebook is a web app that is more interactive.

Don’t let the word “app” confuse you, though. Web apps don’t need to be downloaded like mobile apps do.

Web apps load in browsers like Chrome, Safari, or Firefox and they don’t take up any memory or storage on the user’s device.

How are Web Apps built?

The vast majority of Web App development is done using JavaScript, CSS, and HTML5.

Unlike an iOS or Android app, there is no software development kit (SDK) for a developer to work with.

There are templates and frameworks for developing web apps like Angular, React, and Vue.js that you can use to get a quick start.

Developing Web Apps vs. Mobile Apps

As opposed to mobile apps, developing a web app can be simple and quick – although it can also be complicated, depending on your requirements.

It’s often a good way to test out an idea before investing in a native mobile app.

However, if your web app is relatively simple and designed for desktop users over mobile, you may miss out on mobile traffic, engagement, and revenue opportunities.

Mobile traffic had already surpassed desktop traffic by the end of 2016, so developing for desktop first may not always be the right solution, particularly if parts of your business revolve around publishing content.

Read more on the benefits of a mobile optimized website here.

Progressive Web Apps

Until recently, web apps lacked the functionality of native apps, like the ability to send push notifications, work offline, and load on the home screen. The internet was mostly composed of static web pages.

However, there have been a improvements to browsers and web technologies – and web apps can now harness all these features.

Apps that take advantage of these features are called Progressive Web Apps (PWAs).

There are a few steps you need to take in order to turn your web app into a progressive web app.

They go beyond the scope of this article, but you can find a comprehensive guide by Google here. You should also check out our detailed guide to progressive web apps that includes a detailed overview and 50 PWA examples.

Are Progressive Web Apps the way to go?

It depends what your goal is. In general, they are good for giving your existing audience a better experience on mobile than they currently get with your site. We recommend  creating a PWA, but it is not really a substitute for mobile apps – it is more of an upgrade of your current web UX. Why?

If your goal is to cover an audience on Android and iOS, then progressive web apps are probably not optimal.

They can be a great solution on Android, but on iOS support is still rather limited, meaning you’ll likely be missing functionality you need in the long run, especially push notifications.

Consumers are also increasingly using Google Play and the App Store to search for solutions to their problems, as opposed to purely using the mobile web – so even though PWAs help provide a better mobile UX they don’t cover all the bases for mobile discovery.

Installation is also a downside. Although it is technically possible to “install” a PWA on a mobile device, the process isn’t especially straightforward and can confuse users – making it harder to get that valued real estate on their home screens.

PWAs can be a good way to quickly get a mobile-app-like web app into people’s hands. For the above reasons and more though, Progressive Web Apps are not a substitute for mobile apps – although they work very well together in tandem.

If you have a WordPress site and want to convert it into a PWA fast, just get in touch with our team. If you already have a PWA, even better, read this detailed piece on how to convert it into iOS and Android apps in just days!

We also created a comparison guide on how Progressive Web Apps compare to Native Apps – you can read that here!

Let’s move on now to mobile apps.

Mobile Apps

When we talk about mobile apps in this article, we’re talking about apps you download from an app store such as the Google Play or iOS App Store.

There are two kinds of mobile apps: native and hybrid.

We’ll go into what constitutes a native and hybrid app in more detail below. But first let’s quickly cover why having a mobile app, whether it be native or hybrid, is a good idea.

Why should I build a Mobile App versus a Web App?

Mobile apps have numerous benefits that web apps lack – they especially make sense if your product or service is something that will be used frequently or habitually.

Thanks to a combination of marketing and ease-of-use, a majority of users on mobile access the virtual world through dedicated apps. Mobile apps offer a more streamlined, ‘contained’ experience, that can retain users more successfully than a web app.

A web app is good for desktop users, first contact, and picking up referral or organic traffic – but it isn’t an optimal mobile experience for repeat usage. It Isn’t ideal for engaging users and building loyalty and habit around your brand.

Mobile apps on the other hand let you meet the expectations of modern consumers and offer them a better mobile UX through a less distracting, more enclosed environment and a direct route through a single tap on their home screens.

This is far more direct than opening up a mobile browser, typing in an URL, and waiting for everything to load.

Just having a presence on the App Stores can be a benefit for certain businesses too. A lot of consumers these days use Google Play and the App Store to search for solutions to their problems, much like they use web based search engines. If you optimise well for App Store SEO, then you can  pick up new users that are searching for related keywords.

Push Notifications

Getting users to your product the first time is easy. Getting them to return can be a challenge.
Push notifications will be extremely important for any serious mobile app.

Only mobile apps give you the opportunity to send well-timed push notifications to re-engage users, promote products and offers, and communicate directly with your userbase.

According to data from Localytics, when a user opts in to receive push notifications, they will launch your app 88% more than a user who doesn’t receive them.

Check out this post if you’d like to find out more about how to use push notifications.

Sharing features

Another key to growing your app is getting people to share the app itself or content within it to their friends.

This can be done on a web app, but it’s best done on a mobile app.

As an app user, you can quickly share to any app on your device (such as Email, WhatsApp, Messenger, Facebook, Instagram etc.) in a much easier way compared to a browser.

Time within apps

Users spend a lot more time on apps than they do on the web.

In fact, research suggests mobile users spend 86% of their mobile time using apps, and, from 2016 to 2018 time spent in apps grew by over 50%.

The popularity of apps has increased enormously and is continuing to rise.

Additional Advertising Revenue

One more advantage to building a mobile app over a web app is ad revenue, and the opportunity to use other app monetization techniques.
CPM for ads within mobile apps are generally higher than in web apps, and on the web in general.

Many people also use ad blockers for their web browsers which can lower your advertising revenue, and figures show that in-app ads are more effective than both mobile web and desktop browser ads.

Does this mean you should always build a mobile app vs a web app or simply a mobile site? Not necessarily!

As a good rule of thumb, if you can imagine a good portion of your users accessing your service or content once daily, then an app will make sense.

If what you provide is generally used once and never again, then don’t invest in an app and focus instead on a good mobile optimized web presence.

Now let’s go through the two kinds of mobile apps: Native Mobile Apps and Hybrid Apps.

Native Apps

What is a Native App?

A native app, or native application, is a software application built in a specific programming language, for the specific device platform, either iOS or Android.

Native iOS apps are written in Swift or Objective-C and native Android apps are written in Java.

How are Native Apps built?

Unlike web apps that are written primarily in Javascript, native apps are applications written in languages that the platform they are being built for accepts.

For example, Swift or Objective-C is used to write native iOS apps, Java is used to write native Android apps, and C# for the most part for Windows Phone apps.

Apple and Google offer app developers their own development tools, interface elements and standardised SDK; Xcode and Android Studio.

These tools allow any professional developer to develop a native mobile app relatively easily.

Benefits of Native Apps

So why are most apps native? The reason is that native apps have a number of significant advantages over the alternatives.

Fast and Responsive

Native apps offer the fastest, most reliable and most responsive experience to users. This is unlikely to change in favour of web apps.

Easy to tap into wider device functionality

Native makes tapping into the camera, microphone, compass, accelerometer and swipe gestures super easy.
It’s still possible using the alternatives, but it’s easiest on native.

Match app UI/UX to platform conventions

You’re more likely to please your users due to the way you can match each app’s UI/UX to the platform conventions.

There are dozens of UI/UX differences that make users feel at home. By building native, you don’t have to compromise with UI/UX that you hope will be user-friendly for all platforms.

Disadvantages of Native Apps

More than one codebase

iOS apps will not run on Android and vice versa, so you will have to work with different codebases for every platform you choose to build in.

Native Apps cost more, and take longer to build

Native apps cost more to develop than hybrid apps. You’re looking at $100K to get first versions out on iOS and Android, and that’s a relatively conservative estimate.

Most developers specialize in one platform (Android or iOS), so to have your application developed on both platforms will require two separate developers (or teams), which adds to time and cost.

Examples of Native Apps

A large number of the most popular apps out there like Lyft, Pokemon Go, Twitter and many more are fully native.

However, it’s becoming trickier to distinguish apps that using purely native code on Swift, Objective C and Java from apps that are relying on hybrid solutions or cross-platform SDKs, thanks to the advancement in hybrid technologies.

Building Cross-Platform Native Apps

As we said, the main disadvantage of native apps is having to develop apps separately for each platform you want to cover.

That’s still true if you want to stick to the native SDKs provided by Apple and Google, but in the last few years, several alternatives have become available to reap the benefits of cross-platform development without sacrificing the user experience or access to native APIs.

There are several platforms that allow for cross-platform development including Xamarin, React Native, Titanium, and Google’s Flutter, which are all worth a look.

Xamarin

Made by Microsoft, Xamarin is a platform that lets developers build one app that works on multiple platforms in C#. They also provide free tools to build, test, distribute, and learn from your apps.

Xamarin feels like a more complete development environment than PhoneGap or Titanium, even offering a test environment where you can test your app on thousands of virtual devices before launching (this is crucial for cross-platform apps – you need to make sure your app works as expected on both iOS and Android, and on all devices).

Xamarin also offers a few prebuilt apps you can use to get a quick start. Some companies that have built apps with Xamarin include Slack, Pinterest, and Honeywell.

React Native

Not wanting to be left out of the fight, in 2015 Facebook launched an open-source project of their own called React Native, which lets you build real, native iOS and Android apps with one codebase.

It’s not a “mobile web app”, a “HTML5 app”, or a “hybrid app”.

With React Native you can build a real native mobile app that’s indistinguishable from an app built using Objective-C or Java.
You just use JavaScript and React to put it together.

At Instagram, they published stats showing that for the features they built with React Native, the amount of code shared between iOS and Android was over 90%.

While React Native doesn’t give you access to all the device’s functionality, you can weave in native code if you need to.

There are some pretty heavy-hitters using React Native, including Facebook, Walmart, Tesla, and Airbnb. You can check out some React Native apps here and here.

Titanium

Titanium, in its latest version, is similar to React Native in that apps are written in Javascript, but produce a native application; bridging native APIs to Javascript with its own set of APIs.

It no longer relies on webviews and this results in a more “native” look and feel for your app.

Titanium has a great showcase of apps built with their technology on their website. Some of the more well-known apps built using Titanium are eBay, ZipCar, PayPal, and Khan Academy.

Hybrid Apps

You install it like a native app, but it’s actually a web app on the inside.

Hybrid apps, like web apps, are built with Javascript, HTML, and CSS and run in something called webview, a simplified browser within your app.

Why Hybrid?

The Native vs Hybrid app debate is complicated, and even though we’ve just shown you some key benefits of building a native app, there are certainly advantages to going hybrid.

Let’s take a look at them.

Say you have an idea for an app and you don’t know if people will like it or not.

Your goal is to put something usable into their hands as quickly as possible. You’re short on resources, so you need to create a simple version of your product that still provides value.

In the startup world, this is called an MVP, or minimum viable product.

Building a web app might be the truly minimal option, but it won’t really allow you to test whether people will download and use an app on their device.

A hybrid app offers a solution to this.

Advantages of Hybrid Apps

One codebase to manage

All the advantages of hybrid apps stem from the fact that, instead of building two apps, you’re building one app and simply tweaking it a bit so it works on both platforms.

With a hybrid app, you only have one codebase to manage.

You save time and money

As you only have to manage one codebase, you’ll probably require half the number of developers two native apps would have required. Or, with the same number of developers, a hybrid app could be published in half the time.

In addition, hybrid app developers are often less expensive than native application developers.

Easier to scale

Hybrid apps are easier to scale to another platform. Once you’ve built for one platform, you can launch on another like Windows Mobile with ease.

You still have access to device features

As with native apps, hybrid apps let you retain the same ability to access device features.

This is thanks to solutions like PhoneGap that act like a bridge between the native SDK and the webview in which the app runs. We’ll talk about PhoneGap below.

Disadvantages of Hybrid Apps

Performance

Performance is probably the biggest disadvantage of hybrid apps.

Because hybrid apps load in a browser-like component called webview, they are only as good as the webview which is responsible for displaying the UI and for running Javascript code.

In the early days of mobile, Google and Apple didn’t give webview the same engines used by their mobile browsers, Chrome and Safari. Since then, webview has vastly improved but it hasn’t necessarily reached native performance yet.

We will get deeper into different aspects of performance later in the article.

Cross-platform development is tough

Getting your hybrid app to run appropriately on each platform generally takes substantial work.

In some situations, the total cost might become comparable to that of fully native apps, rendering the cost benefits negligible.
It all depends on how close you want to get to the “native user experience” or how simple your app is.

The UX of the app may suffer

iOS and Android users tend to be very loyal to their platforms, and since they’ve been using them for years, they’re used to how things work in native apps.

The differences are subtle but can be frustrating for your app users.

By building a hybrid app, you won’t be able to please both camps. Try too hard to customize the app based on the platform and it may end up costing the same as two native apps.

There are some ways you can do this which we will discuss shortly.

Hybrid App Platforms

PhoneGap/Cordova

PhoneGap is probably the most well known among hybrid app platforms and probably the easiest to begin with for a web developer.

Cordova is the open source foundation and engine of PhoneGap. It’s backed by Adobe and is completely open source. Cordova lets you create cross-browser mobile applications with Javascript, HTML, and CSS.

These apps run in a WebView and are then wrapped in native code. PhoneGap then offers native plugins that allow you to use all of the device’s functionality including the accelerometer, camera, compass, file system, microphone, media, networks, notifications, geolocation, and storage.

Apps need to be packaged into binary files which will include a webview wrapper and your app’s HTML files, normally loaded locally on the device.

Check out these PhoneGap apps: Tripcase (iOS / Android) and Untappd

Hybrid App Examples

If you’re interested, take a look at some of these example Hybrid Apps – you’ll notice they look and feel great to use, and in most cases it’s hard to tell they’re not native.

• Marketwatch (built with Ionic)
• Sworkit (built with PhoneGap)
• Untappd (built with PhoneGap)
• Giro D’Italia official app (built with Onsen UI)
• Offcourse Golf (built with Onsen UI)
• Tripline (built with Framework 7)

Should you convert a web app into a hybrid app?

If you’re building an app for an existing site or you have a mobile web app that does exactly what your app should do (but only misses what a native app generally provides: app store presence, push notifications, home screen icon, offline use), then turning your site or web app into a native app can be both quick and economical.

You won’t have to manage two platforms (iOS/Android) separately.

You’ll have a single web app that covers the mobile web and the two major mobile platforms with your apps.

How to make a Web or Hybrid App feel Native

The ultimate goal of a hybrid app is to feel like a native app on the platform it’s being used on. Here’s what you can do to make your hybrid app look and feel like it’s coded in native:

1. Use a splash screen, so that the app loads to a fully loaded app.
2. Add a back button to the UI, to make sure users can navigate intuitively. Android already includes a back button in the system interface or in the device, but iOS needs your app to allow users to navigate back as they move around.
3. If you’re building an app from scratch, use a UI library like Onsen UI. It will not only speed up development time, it will make design decisions much easier. UX and design is based on conventions or what the user is used to. A library like Onsen UI has already made all the mobile components according to conventions.
4. Get rid of the 300ms delay. All browsers, including webviews would normally add a 300ms delay when users tap on an element. Why? It’s because it’s waiting for a second tap. 300ms may not seem long, but it’s enough to make an interface feel sluggish.
5. Where possible, follow the style guides. If you’re designing your app from scratch, have your developer and designer read the style guidelines created by Apple and Google.
6. Make wait times seem shorter. If you can’t avoid having a screen delay, show a loading icon or progress bar. Any delays longer than 0.1s are significant enough to warrant a loader, in order to warn a user the app is alive and loading.

OAKWOOD already does most all of this for you, so if you’re looking for a quicker way, and to have everything done for you, call us today and lets get started.