Progressive Web Apps(PWA) vs Native Apps

Mr Super Shetty
A Web Developer
Published in
7 min readSep 27, 2018
PWA logo

A few years back the difference between a web app and a native app was huge. You didn’t have API to access the device. You couldn’t do a lot of stuff which native apps could do. From there the world has come a long way. Today the difference is pretty small. In this post, I will look at the advantages that native apps have over web application in 2018.

We will look at device capabilities followed by custom features in each OS. For the sake of comparing we will be looking at

  1. Google — Chrome on Android, Desktop(Windows, Mac, Linux), Chrome OS,
  2. Apple — Safari on iOS and Mac
  3. Samsung Internet
  4. Kali OS(proprietary reincarnation of Firefox OS) wherever possible

Part 1 — Basic Device Capability

In terms of basic hardware access, web today has access to most of the devices hardware. Geolocation was available in early part of this decade, Basic camera access for file upload came soon. This slowly expanded to push notifications, Bluetooth, full camera and audio access, light n proximity sensor etc.

Today we have come a long way in this category. And even if something is missing it’s getting added. In the very near future, you can register your Web App as a Payment Provider and websites can accept payments via you by just mentioning that they support you. Soon, people will be able to Share to your site, all without any website explicitly implementing your API. Let’s look at some of them in a bit more detail.

Sensors (like Proximity) — Google added support for some like accelerometer and gyroscope recently. Rest, it’s in process of getting added to Chrome/Android. This is done with the help of Generic Sensor API. Apple(iOS and Mac) could be adding this in future.

Bluetooth — Chrome and Samsung Internet on Android support Bluetooth. Apple is not considering adding Bluetooth. Samsung Internet too supports it.

Bluetooth example by Chrome

NFC — Experimental implementation is available in Chrome on Android, behind an “Experimental Web Platform Features”. Which means Samsung Internet may also not have it. Apple is not considering adding this.

.

Push notifications — All platforms now support Push Notifications via Standard or proprietary API except iOS. iOS has all the pieces in place but Apple has taken a stance that due to battery life issues they won’t support it. On Mac, Apple has a proprietary implementation with a similar flow as the standard API.

.

Contacts — W3C(Web Standards Body) doesn’t plan to add support for this due to security and privacy implications. But this isn’t a deal breaker. On most platforms, contacts get synced to a cloud service. Most of these services have APIs for storing and retrieving contacts thus circumventing the problem.

SMS — Again like the Contacts support W3C doesn’t plan to add SMS support. You can use intents or SMS: URL’s on some platforms/browsers to send SMS. Alternatively, you could use third-party SMS gateways to send SMS. Only thing now is reading SMS. On iOS 12 Safari will try to Auto-fill OTPs. On Android, you can’t do anything. The W3C is looking to add support for this one use-case, autofill OTP. Unless you are building an SMS manager or providing some Smart insights based on SMS then this too is not a deal breaker.

VR and AR — Most browsers on Android support some or the other AR VR devices. They do it via custom API or via the older WebVR spec. Newer WebXR API is being considered by some. Apple is also developing AR n VR capabilities.

.

Share — Chrome on Android allows you to trigger share sheet to share your content. Apple is adding the same. Currently, you cannot register yourself as a share target i.e other apps share with you but you will soon be able to do it via Share Target API. Chrome on Android is adding support for it.

Source: https://codeburst.io/the-web-share-api-is-here-cb651d84eccd

.

Instability — On Android Chrome and on Chrome OS, PWA apps added to Home screen get installed on the device. Google is adding support for this in its desktop app too. On Apple, it doesn’t matter as websites with the special meta tag that were added to home screen behave as apps only. Though they don’t work as expected.

Andorid and iOS Add to home screen option

Part 2 — OS Specific Features

In my opinion, this will always be a cat and mouse game. The platform needs to makes web apps the first class citizen like Mozilla’s defunct Firefox OS or even Windows. Firefox OS supports most of the Web API’s and where web doesn’t have an API, it has its proprietary API. Kali OS, the reincarnation of Firefox OS fully supports Web API’s. Windows, is another shining example of this. It supports multiple languages for developing Desktop apps. I am referring to first party languages like C#, C/C++ and JS. This too follows the exact same philosophy as Firefox OS. Follow the standards API where you can, go custom when not available. On platforms that don’t have web apps as the first party, it becomes a cat and mouse game.

Android

Android has a couple of features that are missing for PWAs:

Widgets(since ages): This is the widgets that you can add to the home screen. This is the only feature of the list that is great to have but all apps may not need it

Android Widgets- calendar, music, weather

Icon Pack(since ages) : For a user, It’s tedious to change icon of a PWA as most icon packs only theme native apps. Several launchers don’t support changing icon of a app unless the icon pack doesn’t support it.

App Shortcuts(Nougat+): This is the menu that appears when you touch and hold an icon

App shortcuts

Notification Dots(Oreo+): When your app has an unread notification, a dot will appear on the icon even if the user clears the notification from the Notification shade. This entices the user to click on it.
Update: Coming soon on Chrome

Notification Dots and /notifications in App shortcuts

Adaptive Icons(Oreo+): Each app displays icon that’s of different size and shape. To overcome this, Android came up with Adaptive icons. With the adaptive icon, a launcher can display a circular shaped icon or squircle. All native apps will transform but your web app won’t.

Adaptive icons

Notification channels(Oreo+): Oreo added support for categorising notifications. Now a user instead of turning off all notifications can just turn off a category. For web apps, it’s still all or nothing. But this isn’t a deal breaker as it is easy to implement inside your app itself.

Slices(Pie+): On Pie, when you search for something in the Google search, apps can show you mini widgets based on your search. Like your cab app showing you rates and ETA if user search for the right keywords like location or cab

Some Slices examples

iOS

Home Screen Actions (devices with 3D Touch): This is the same as App shortcuts on Android. This is the menu that appears when you touch and hold an icon.

Today widget: This is similar to android widgets but gets added to the notification shade/drawer instead of the home screen. This is the only feature of the list that is great to have but all apps may not need it

Todays Widget — source:cnet

--

--