How does a Progressive Web App (PWA) work?

PWAs can range in functionality from barebones to advanced features like geolocation and Bluetooth. The baseline technical requirements Google has defined for PWAs include:

1. Service worker

A service worker is JavaScript code that runs in the background of the PWA. Their primary use is to precache resources, so the web app loads fast and can even have offline functionality. After the website has been visited once, the service worker saves – or caches – critical assets like HTML files and images so that it doesn’t need to make API calls to the backend as frequently next time the user visits. Service workers can be used for other tasks, however, such as push notifications and background data syncs.

2. Web manifest

The web manifest is a JSON file that defines the look and feel of the PWA when it’s installed. It’s used to customize things like the home screen icons and how the web app is launched. In general, the web manifest includes metadata like the app name, version, description, theme colors, and screen orientation. A web manifest is essential for creating a native-like app experience.

3. Transport Layer Security (TLS)

PWAs are required to communicate over HTTPS by having an SSL certificate installed on its web server. The SSL certificate creates a secure, encrypted connection between the frontend app and backend server. These requirements leverage the TLS protocol to ensure secure data transfers when the web app communicates with the backend eCommerce and CMS systems. This is crucial for keeping user information safe and is critical for eCommerce stores that handle customer credit card information.