Progressive Web Apps have gone from buzzword to mainstream in record time. Freeing the user experience from the boundaries defined by devices and network conditions marks another step in the digital evolution. So does bridging the gap between web and native applications to offer unprecedented usability and reliability. While PWAs are making headway in boosting performance and engagement, Code & Pepper investigates their key features and business growth potential.

PWA

Progressive Web Apps and “all the right vitamins”

PWAs are essentially websites leveraging certain properties and APIs of modern web browsers, so that they can be used in a similar way to native applications—native mobile apps in particular. One of PWA’s pioneers, Alex Russell, called them “websites that took all the right vitamins”. A quick look at some of those pills can be a good point of departure for discussing business benefits and basic implementation requirements.

  • Vit. A: Accessibility. Fast and responsive by design, PWAs work great on all browser-enabled devices. But they can be also installed and launched from a desktop or home screen shortcut. Limited storage is no longer an issue, as most PWAs are ultra lightweight compared to native apps. Access to some device-specific features (such as audio and video capture) can further boost your PWA’s usability.
  • Vit. D: Discoverability and distribution. This pill does away with the search-and-download friction of app stores, as PWAs can be installed with one click of a button, straight from the website. Search indexing, linkability and additional SEO-friendly properties also make them more visible in search engines. Sharing and distribution of a PWA is as simple as copy and paste of the app URL.
  • Vit. E: Engagement and re-engagement. Once installed, PWAs can do wonders to re-engagement, using web push notifications to communicate key events or updates based on selected criteria and user preferences. To avoid “notification fatigue”, make sure users feel in control (push notifications as an opt-in feature) and recognize the value of timely and relevant messaging.
  • Vit. C: Connectivity independence. This app-like property means that core app functions are available regardless of network conditions. PWAs are reliable in a number of real-life situations, like using low-end devices, working in plane mode or in places with poor or flaky Wi-Fi (aka Lie-Fi).

Mobile UX: more expectations or less tolerance?

Progressive Web Apps are a particularly hot topic in the context of mobile applications. With the growing smartphone penetration and mobile data traffic on the rise, certain aspects of mobile user experience are becoming business-critical. According to Deloitte, when it comes to mobile site performance milliseconds make millions. User expectations in terms of load times are the main battleground between digital brands competing for customers’ attention and loyalty. Optimising performance on the UX level might be the first step to satisfying users’ appetite for page speed. However, with PWAs you can take that process even further.

Household names by proxy: PWA benefits

What do Facebook, Uber, AliExpress and Twitter have in common? Well, apart from being multi-million-user platforms, they are flagship examples of PWAs put to action and rocking the mobile channels. Improvements across the board is what attracts many businesses to investing in PWAs, including:

  • reduced load times and bounce rates
  • lower data usage
  • reduced customer acquisition cost
  • more time spent on site per session
  • higher click-through rates and conversions
  • increased mobile use and sales

It’s also worth noting that turning a web app into a PWA can be fast and might prove more cost-efficient than having separate teams working on desktop and mobile versions (not to mention separate Android and iOS versions). The same goes for maintenance, as fixes and updates can be implemented in a coordinated manner and deployed without the customary delay imposed by app stores.

PWA fundamentals. Introducing Service Workers

Technically speaking, web apps can be defined as Progressive Web Apps if they include the following 3 components:

  • HTTPS encryption. This secure context is necessary to register and execute Service Workers.
  • Web app manifest. A JSON text file with essential app info (name, start URL, display, icons, etc.) defining its behaviour upon launch; also used during installation and to auto-generate splash screens.
  • Service Worker. An event-driven JavaScript code running in the browser. It intercepts requests from the app and provides responses from the cache or the network.

This strategic position in the browser enables the Service Worker to act as a proxy between the app, the Cache API (storing the App Shell and a set of file-based responses to given requests) and the network. Because of that, PWAs rely on Service Workers to:

  • receive push messages from the server
  • reduce load times (depending on the preferred caching strategy)
  • minimise data traffic and handle multiple caches
  • serve predefined responses in offline mode 
  • save user-generated data until online again
  • use background synchronization

PWAs in focus: check yourself before you wreck yourself

Naturally, every technology has its downsides. While PWAs might be a great fit for many eCommerce, mCommerce, web publishing or personal finance services, they can fall short under certain conditions. Limited hardware access or lack of support for inter-app communication might affect some target groups (particularly iOS users). Checking browser compatibility for core features will give you a clearer picture of potential limitations.

When in doubt as to whether your app is PWA ready, you can use the Lighthouse tool developed by Google. It will analyse load times, accessibility and compliance with selected best practices (security, SEO, offline access, etc.), generate a report listing all confirmed/missing PWA features and provide recommendations for creating a richer app-like experience.

Run downasaur, run!

Though it’s hard to speculate about the future of Progressive Web Apps, they already show a lot of promise. The PWA technology will be even more potent once its features are fully supported by all browsers. Further developments in terms of engagement and performance regardless of network conditions could set the course for a truly immersive user experience. Looks like chasing a downasaur around an offline desert might soon become just a distant memory.