Quantum LEAP '24

Join peers to learn about efficiency, growth, and platform training.

What is Progressive Web Apps (PWAs)?

What are progressive web apps (PWAs)?

Progressive web apps (PWAs) are a type of web-based application software built to adapt to any device or operating system, though they function best on modern web browsers, like the latest version of Google Chrome. They take advantage of the newest available features on the user’s device and browser, including the latest APIs and  third-party plugins, to unite the best features of both web and mobile apps.  

PWAs were introduced by Google in 2015, when it was discovered that people wanted app-like user experiences on websites. Android devices started supporting PWAs, which led to a progress web app boom in India. Apple, on the other hand, was late to the PWA game, as Safari only started supporting PWAs in 2018.

Built using traditional HTML5, CSS3 and JavaScript, progressive web apps are responsive, which means that they adapt to your device’s form and screen size. Because of this, they are a good option for organizations seeking a cross channel application that works with mobile, tablet, and desktop devices. All users run the same code for PWAs, so there is no version fragmentation, a common obstacle with native app development. 

Like native mobile apps, PWAs offer improved user retention and performance, all without the added stress of building and maintaining a native application. PWAs can also be modified based on GPS, user behavior, and customer data.

PWAs can enable push notifications so that users receive a notification even when the browser is closed. Similar to mobile apps, PWAs can use push notifications to re-engage their users.

Currently, the Push API is only available in Chrome, though Firefox is in the process of adding the new features. The push API is not currently supported on Safari, and Apple has not made any plans to do so publicly. 

If you’re thinking about building your first PWA, check out popular PWA starter kits such as Polymer and Web Starter Kit

Mobile app stores are starting to host PWAs, and organizations can use third-party wrappers to convert their PWA into a native app.

What are the benefits of using Progressive Web Applications (PWAs)?

The rise of e-commerce has prompted retailers to seek out interactive, native-like app experiences, but for the mobile web. This is where PWAs come in. 

The interactive components of PWAs help to drive conversion rates and revenue. Google, eBay, Starbucks, West Elm, and other organizations have been using PWAs for some time. With Starbucks, you can craft your mobile-order right from your browser—there’s no need to download the app. 

Covid-19 has also pushed people to spend more time on mobile websites—PWAs help to ensure that customers enjoy the user experience of the mobile website, especially when a native app is not available. 

Another advantage that PWAs have over native apps is that they are discoverable in search engines, which is helpful if SEO is part of your organization’s strategy. PWAs also get an SEO boost, since mobile user experience is a key factor in Google search results. PWAs thus benefit from the web’s vast network while nonetheless offering the user experience of a native application.

Cross-platform apps like PWAs are easier to build than native apps, which is one of the reasons they have become so popular in recent years. Progressive web apps are much easier to deploy and maintain than native mobile applications.  

However, certain features are not available on progressive web applications due to issues with cross-browser support. In these cases, organizations might choose a native application, which ensures that every single person has the same user experience, instead.

What is Application Shell Architecture for Progressive Web Applications (PWAs)?

Progressive web applications (PWAs) are generally built (or architected) around Application Shells. 

Application Shell Architecture makes it possible to cache your user interface so that the PWAs function offline. Using JavaScript, PWAs populate content on the screen quickly, especially for returning visitors. This means that PWAs work well even when connectivity is low. 

To run offline, PWAs need a service worker, otherwise known as a script that runs in the background and is separate from the main webpage. When an event is triggered, such as a network request, the service worker wakes up and runs until the event has been processed. 

With the help of service workers, progressive web apps can use the Cache API to cache offline and offer an interactive offline experience. The service workers also make it possible for PWAs to load almost instantly for returning users.

Back to glossary