Progressive Web Apps - What are they?

So, what is a Progressive Web App?

Boiling it right down, a Progressive Web App (PWA) is simply an app delivered through the web. (rather than an app packaged and delivered through an app store.) Yes, you’re right, we’ve had web apps for a while, so what’s different now?

PWAs are web applications that load like regular web pages or websites but can offer user functionality such as working offline, push notifications, and device hardware access traditionally available only to native applications. PWAs combine the flexibility of the web with the experience of a native application. It’s the union of technologies.

“Progressive — Works for every user, regardless of browser choice because it’s built with progressive enhancement as a core tenet.”

Back in 2015 two Google Chrome engineers coined the phrase Progressive Web App to describe web applications that took advantage of new features of modern browsers, including ‘service workers’ and ‘web app manifests’ (more on this further down), which meant that users could install progressive web applications on their native operating systems.

This technology is still in its relative infancy and because it is inclusive of several technological approaches there isn’t (yet) a single definition. The following is currently general thinking.

PWA characteristics are defined as:

Reliable — Load instantly and never show the dinosaur, even in uncertain network conditions
Fast — Respond quickly to user interactions with silky smooth animations and no stuttery scrolling
Engaging — Feel like a natural app on the device, with immersive user experience
Progressive – device independent, regardless of browser choice
App-like – Feels like an app with app-style navigation and UI
Up-to-date – ‘Service Worker’ updates by syncing and pushing data
Secure – HTTPS protocol means that interactions stay private
Discoverable – Search engines can spider them (unlike native apps)
Installable – reduces the need to download native apps by allowing shortcuts to be placed on your mobile Home screen
Linkable – No need for installation and easily sharable via a URL
Responsive across devices – desktop, tablet, mobile and beyond
Connectivity independent – ‘service workers’ all PWA to work offline or on low-quality networks.

The general agreement is that to qualify as a PWA the application must satisfy these criteria:

1. Must be running under HTTPS.
2. Must have a Web App Manifest – a simple file (JSON) that tells the browser about your web application (i.e name, author, icon, description) and how it should behave when ‘installed’ on the user’s mobile device or desktop (ie fullscreen and orientation). This metadata allows developers to deliver an app-like experience much like a native app.
3. Must include a Service Worker – a script that runs behind the scenes in the browser but provides access to browser functionality. They can be used to deliver content if the user is offline and deliver push notifications on a mobile device.

Why are PWAs a good idea for my online business?

Lower development costs – Because only one version needs to be developed, unlike a native app, development costs are significantly lower.

Performance – Because a web app experience is fast and slick, the positive user experience will drive conversion rates and customer retention.

Users prefer an app like experience. Because users now prefer the app experience over the browser experience, delivering content in an app like way will drive engagement.

Over 4 times more products per session within apps, compared to mobile sites
3 times higher conversion rates compared to mobile sites
1.5 times more app conversions per session than desktop

SEO and search visibility. PWAs can be spidered and indexed by search engines.

Easier to update. PWAs update automatically and without the need for permission requests.

No App store dependency. Not having to upload apps to an app store is a huge plus for website/app owners. No app stores fees or rules to meet.

Offline browsing drives user retention, especially for retailers where abandoning a shopping cart would be an issue.

Are there any downsides.

• Native apps can access more of the native mobile hardware than PWAs but this may change
• Safari doesn’t currently support PWAs. Presumably, because Apple wants users to stay focused on the Apple store
• Apps in an app store can be promoted, PWAs cant.

Show me some interesting PWA examples

https://app.starbucks.com/
https://www.washingtonpost.com/pwa/
https://www.trivago.co.uk/
https://app.ft.com/index_page/home

Why now?

This technology is still in its relative infancy but with the advantages that it brings, we see it as an emerging answer to responsive sites and with Google now placing greater emphasis on a site’s mobile version over its desktop equivalent, we will see the acceleration of the progressive web application in the coming years and beyond.

Give us a call to discuss how this exciting technology could help your customers.