Award Confetti logo-bs logo-dxn logo-odl Magento Piggy Bank 09AEAE68-D07E-4D40-8D42-8F832C1A04EC 79C8C7E9-0D9D-48AB-B03B-2589EFEE9380 1A734D92-E752-46DD-AA03-14CE6F5DAD57 E622E2D4-3B9C-4211-8FC3-A1CE90B7DFB2 Group 19

What is a Progressive Web App (PWA)?

Many users are now mobile first, some are mobile only. In this environment, speed and convenience are key differentiators for online businesses. Responding to this shift in expectations, browser developers have given us Progressive Web Apps (PWAs). This has opened a new frontier, and the early prospectors are reporting great results.

In this post, we explore what a Progressive Web App is, how they work, and what benefits they bring to the businesses that adopt them.

What is a Progressive Web App?

PWAs are characterised as being:

“Responsive, connectivity-independent, app-like, fresh, safe, discoverable, re-engageable, installable, linkable web experiences.”

Put more simply, they are websites that combine all the benefits of being delivered via the web, and run in powerful modern browsers, but also benefit from some of the things people enjoy about native apps, like working offline.

This “best of both worlds” experience is described by Google as being:

  • Reliable — having the ability to launch from a home screen and load near-instantly, even when there is little or no internet connection available.
  • Fast — exhibiting a high level of performance that allows pages to load quickly and function smoothly, helping to capture and retain users better.
  • Engaging — offering an immersive full-screen experience, with immersive interactive features, without the need for a convoluted app installation.
A PWA combines the best of a responsive website - delivered via the web, no need for installation - with the benefits of a native app - offline working, and super fast loading.

How does a Progressive Web App work?

Despite having app-like features, it’s important to understand that PWAs aren’t a direct alternative to native apps, but rather an enhancement of existing web technology. Websites can be upgraded to being PWAs by taking advantage of a few web standards:

  • Service Workers — These scripts are run in the background by browsers, and allow developers to manage resource requests and caching programmatically.
  • HTTPS — It’s already considered best practice to run websites securely, and for PWAs a secure site is mandatory to access browser features such as geolocation.
  • Web App Manifest — This JSON-based file is a central place to specify how a PWA appears and behaves when installed on home screens and run as a standalone app.

With the technology now available on most eCommerce platforms, it’s clear that implementing PWA is a no-brainer for online businesses. It is easily implemented using current web technologies, and delivers a superior experience for users, which in turn raises satisfaction, encourages engagement, and improves conversion.

Does a PWA use headless architecture?

Headless architecture – sometimes also called composable commerce – is a broader term for the way PWAs, and technologies like them, work.

While a PWA would be classed as headless technology, more broadly, headless architecture works by wrapping a site’s functionality and logic into a set of APIs, which are then hosted by a specialised back-end, accessible to any front-end technology you might want to deploy. APIs (or Application Programming Interfaces) are the intermediaries that allow different pieces of software to talk to each other – so not only does this mean than information is not duplicated across multiple parts of your website, but it means you have the flexibility to plug and play a whole array of different services and software packages depending on your needs.

Without getting too much more technical here – Progressive Web Apps, and other similar headless architecture, gives you the freedom to switch between SaaS providers, build and deploy new features, and experiment with functionality, but without having to rebuild your entire site architecture each time. Effectively, they future-proof your website, empowering your business to stay agile in an ever-changing world of technology.

What are the benefits of a PWA?

PWAs offer more than an improved user experience. The inherent properties of the web platform means they can help businesses solve real problems from reach to maintenance.

  • Easy Distribution — Being a website, PWA are readily available to share, find and use, avoiding the risky tradeoffs inherent to offering native apps through app stores.
  • Cross-platform Reach — Using web technologies means PWA naturally work anywhere the web does, and can be progressively enhanced to harness device capabilities.
  • Native-like Interactions — PWA can break free of the browser and run like full-screen apps, with access to many device APIs, most notably push notifications.
  • Faster Performance — The smarter caching offered by service workers allows PWAs to load in less than a second, saving bandwidth and improving the stickiness.
  • Offline Service — The caching also means PWA can continue to function when connections fail, replacing grey screens with useful content.

What can be achieved with a Progressive Web App?

Businesses are already implementing transactional sites with PWAs, and the case studies being shared contain some impressive results. Here at JH, we were early adopters of the technology – we were the first agency in the world to launch a PWA site on Magento.

Since then we’ve worked with businesses in a range of sectors to build and deploy Progressive Web Apps on Adobe Commerce and Magento – all of which have seen impressive growth and improvement across their core business KPIs. These include:

When is the time to switch to a Progressive Web App?

It’s not just our clients here at JH – growing businesses worldwide are adopting PWA technology every day, from Starbucks and Target to Spotify, Pinterest and Twitter. Businesses who harness this technology now are going to stand out even further from competitors who are still struggling with flexible layouts.

In reality, you don’t need to wait for the future. PWAs are already widely supported across mobile and desktop devices, and many eCommerce platforms already offer the technology. A great way to dip your toe in the water is by adding a single feature like a simple offline page. More features can be added incrementally as development time and new APIs become available.

This article was originally published in our “What’s Next in eCommerce” ebook, and has been updated with new information as of January 2022.