Progressive Web Apps (PWA) For Ecommerce Sites

Progressive Web Apps (PWA) is a technology that is increasingly being implemented into many ecommerce sites. In this post, we present how such applications work, what specific benefits they provide to online stores, and how this technology can be applied to existing sites.

What is progressive web application?

PWA is nothing more than a normal web application (HTML, CSS and JavaScript) enriched with a few features, which allows visitors to a site to experience a native-app-like experience.

An app has to meet the following requirements (source: Google PWA checklist):

It is served by HTTPS for data security
Pages are responsive (automatically adjust to the size of the display and the resolution of the device)
All app pages load while offline (at least with some basic content)
It has a file with metadata (manifest.json) that allows users to add a shortcut to the home screen
It must load quickly even with slow 3G connections
The application must work correctly in Chrome, Edge, Firefox and Safari browsers
Page transitions should be snappy and responsive

Google provides the Lighthouse tool, in which developers can test created sites for their basic compatibility with PWA technology.

PWA benefits in ecommerce

Globally more than 60% of total retail ecommerce sales is generated through mobile channels and in 2021 this is expected to increase to almost 73% (source: Statista). Responsive web design (RWD) has become an industry standard feature and sites that don’t display properly on mobile devices have little chance of succeeding on the market. More and more, online stores are choosing to make their own apps available to download from the AppStore or Google Play. So, why is there an emphasis on ecommerce to turn to PWA technology? In short, PWA combines the best elements of both RWD and native apps.

Despite the fact that mobile applications have become very popular, ecommerce business owners quickly noticed that not every user wants or has time to install apps. PWA’s feature “Add to homescreen” while visiting a favourite online store is faster to use than searching for an app in the market and then losing time and data to install it.

One of the key functions of native apps are notifications about things like upcoming promotions. PWA is also equipped with the push notifications feature, which, as in the case of mobile applications, increases user engagement.

Developing and maintaining both an ecommerce site and a mobile application is expensive. In some cases, ecommerce businesses are also forced to pay a fee for having the application in app stores. Thanks to PWA technology, however, these same businesses can decide to focus solely on developing just a web application, and significantly reduce programming costs as a result.

PWA also helps in getting better conversions in online stores. For example, after implementing PWA in their online store, AliExpress observed an increase of conversion rates for new users of 104%. The PWA concept helped them also generate twice as many page visits per session, and time spent per session increased an average of 74% across all browsers (source: developers.google.com). More examples of successful PWA implementations and statistics can be found in this list.

How to start with PWA

The good news is that the implementation of PWA on an ecommerce site can be done progressively. Whether this is possible at all depends on whether the platform you are using is open source. In the case of SaaS solutions, you are unfortunately dependent on the vendor.

To ensure your ecommerce site can benefit from PWA technology, at a minimum there are two components to be aware of: Web App Manifest and and Service Worker.

Web App Manifest is a JSON file that provides information about the website and allows a user to add it to homescreen. Adding Web App Manifest to an existing ecommerce site is relatively easy and only takes a few hours to integrate.

Service worker is a JavaScript that file runs in the background as a stand-alone service and allows activities such as providing push notifications and pre-loading materials that can be seen by users offline. The implementation of Service Worker on an ecommerce site is a bit more complicated and requires individual analysis.

Čtěte také