Progressive Web App (PWA) and Hardware Access

The common knowledge is that Progressive Web App, while engaging in its user experience and significantly faster than the traditional website, is still limited in its hardware capabilities. This is a direct result of the fact that a typical Progressive Web App is still very much a webpage that relies on the Standard Web capabilities to deliver app-like features (e.g. push notifications, add to home screen, and so on).

But just how comparable is it to a typical mobile native application?

That’s what we’re here to find out.

PWA and Hardware Access

A PWA relies on Web APIs (Web Application Programming Interfaces) to access hardware features, and as a result of which, hardware access in PWA is oftentimes a hit or miss since not all browsers are the same. In the best-case scenario—that is if all hardware access APIs are supported in the browser in use—a Progressive Web App can be just as fully functional as a typical mobile app, barring a few capabilities which we’ll be discussing below.

Here’s an overview of some of the features previously exclusive to native apps that PWA can now take advantage of:

• Geolocation

User location can now be requested using the geolocation API which uses available location-capturing methods on the user’s device, e.g., Wi-Fi, GPS, or GSM. Almost all browsers support geolocation nowadays so it shouldn’t be an issue for most developers.

• Device Orientation & Motion

With the right implementation, PWAs can accurately capture the orientation and motion of the user’s device in three dimensions. This is all possible thanks to the DeviceOrientationEvent and DeviceMotionEvent.

• Full access to camera & microphone

Full access to the user’s camera and microphone is available and supported in most Chromium-based browsers. Besides the basic features, you now also can gain access to advanced features such as Advance Camera Controls, Shape Detection, and Speech Recognition.

• Vibration

Vibration is also supported in almost all modern browsers and the implementation process is relatively effortless even to the laymen:

var vibrate = navigator.vibrate || navigator.mozVibrate;

// 2-second vibration
vibrate(2000);

// 2-second vibration followed by a half-second pause, and then followed by another 2-second vibration.
vibrate([2000, 500, 2000]);

• Augmented Reality 

With WebXR Device API, augmented reality (AR) and virtual reality (VR) are finally possible on the Web. This is all still a relatively recent phenomenon in web development, but you can expect the API to only be more polished in the near future.

Of course, the hardware capabilities of a typical PWA are not limited to just these. For a full list of currently supported features in a PWA, head over to WhatWebCanDo as the site has done a good job of covering this aspect quite extensively. Do note that different browsers will show different hardware capabilities since not all browsers have the same capabilities.

Where PWA is still lacking

The Web is growing fast in its hardware capabilities, but apparently not that fast. Here are some of the current hardware limitations that PWA is facing:

• System access: PWAs still struggle to make changes to the device in a systemic level, which includes access to system settings, logs, etc
• Low-level hardware access: While there are certainly some recent improvements made on the low-level APIs front, it’s not nearly enough to consider PWA to be on-par with native mobile apps in this regard. Web NFC (Near Field Communication) API, for example, is currently only available as a enable-experimental-web-platform-features experimental flag in Chrome, and not yet available for public use due to security and privacy concerns.
• Telephonic features: There are some workarounds to deal with this, but the fact of the matter is that your typical PWA can’t make phone calls and send SMS/MMS. This shouldn’t be an issue for most developers though, as a simple Web OTP API should be enough for most use cases.

Conclusion

Unless your goal is to make a deeply integrated native app that can take advantage of all the resources that are on the user’s device, PWA should still be a decent alternative to consider; and if you factor in all the benefits of a PWA which includes the ability to work cross-device, it should be a no brainer pick for most businesses out there.

For Magento merchants who wish to implement PWA, SimiCart’s Magento PWA is a reliable & affordable solution that can greatly leverage the user experience of your site.