logo-footer

What are PWAs? Progressive Web Apps: The Guide

Mariel Lettier

Table of Content

What are Progressive Web Apps?
Progressive Web Apps Pros and Cons

How do Progressive Web Apps Work?
How to Create a PWA?
Real-life Examples of PWAs

Are Progressive Web Apps the Future?
Conclusion

Progressive Web Apps (PWAs) are quite a recent development. But they have made a lot of progress in only a few years. PWAs have brought mobile app features to websites and significantly boosted user experience.

In this article, we'll go over all your burning questions about Progressive Web Apps. What exactly are they? How are they different from regular Web Apps? What do they bring to the table? We'll also explain how PWAs work and give you the resources you need to create one. Further, we'll show you some successful PWAs. Let's dig in!

What is a Progressive Web App (PWA)?

Steve Jobs introduced the concept of PWAs in 2007. At that time, he spoke of Web Apps as fully integrated through the Safari browser. Yet, this did not pan out. In the end, Frances Berriman and Alex Russell coined the term “Progressive Web App” in 2015.

Progressive Web Applications, or PWAs, are websites that act as native apps. Like any other website, they are built using HTML, CSS, and JavaScript. But, to be a PWA, there are specific requirements to meet. In this context, PWAs must be discoverable, installable, linkable, and network-independent. Also, they should be re-engageable, responsively designed, progressively enhanced, and secure.

What is a Progressive Web App (PWA)?

Web App vs. Progressive Web Apps (PWA)

So, what’s the difference between a traditional Web App and a Progressive Web App? While a web app is only a website, a PWA adds extra capabilities to the mix.

● Load times are also shorter with PWAs than with web apps.
● Unlike a web app, you can also install a PWA on your preferred device.
● PWAs can send push notifications, which improves user engagement.
● Progressive Web Applications also provide a User Experience (UX) like a native app.

Progressive Web Apps (PWAs) Pros and Cons

Although they have their drawbacks, PWAs come with an extended list of benefits. Here are the top pros and cons of Progressive Web Apps.

Pros of Progressive Web Apps

Development Cost. PWAs take less time to develop than native mobile apps. Consequently, it leads to a lower development cost.

Platform Independence. Since PWAs are technically websites, they work on any device. Thus, there are no compatibility or resolution support issues.

Offline Use. Users can use Progressive Web Apps even offline. If having an unstable connection, users can still access the prior viewed info in PWAs.

Loading Time. PWAs load instantly. As a result, statistically, they have a lower bounce rate. The fewer users wait for a page to load, the more unlikely they will abandon it.

Instant Updates. Since PWAs are connected to the web, users don't need to install updates. These occur automatically upon loading the site. Thus, users are constantly working with the latest version.

SEO Support. As PWAs are smoother and faster, they take less time to achieve Google's indexing.

No App Store. PWAs remove the middleman, i.e., the app stores. You don't have to worry about the extra cost or the validation process.

Cons of Progressive Web Apps

iOS Issues. PWAs can only run on iOS 11.3 and later versions, and Apple does not support all functionalities. As a result, the User Experience has limits on iOS devices.

Firefox Support. Almost all web browsers support Progressive Web Apps, but Firefox is an exception. Users often turn to extensions or add-ons to be able to access all PWA functionalities.

Fewer Functionalities. Although PWAs add a lot of great functionalities, there are still some limitations. Users cannot yet access their contact list, Bluetooth, or calendar through PWAs.

How do Progressive Web Apps (PWAs) Work?

As we’ve mentioned, a PWA is essentially a website that can be installed on any device. The crucial elements behind Progressive Web Apps are service workers. These are JavaScript scripts used to intercept and control network requests. Fast loading, offline access, and push notifications are possible due to service workers. This article can give you more info about service workers and how to install them. The other two core elements are a secure connection (HTTPS) and a PWA manifest file.

How to Create a Progressive Web App (PWA)?

How to Create a Progressive Web App (PWA)?

A step-by-step guide on creating a PWA would be a bit out of scope for this article. But we can lead you in the right direction. So, here are some links with resources on creating a Progressive Web App.

● Mozilla’s dev site has resources to help you understand and create PWAs. Find it here.
● Heroku offers a guide on creating a PWA from your existing website. Check out this article!
● Microsoft Learn gives you all the resources you need to get started with PWAs.
● There are many tutorials available on YouTube as well. Check out this one by dcode.
● This list of resources comes from Microsoft Azure.

What is an Example of a Progressive Web App (PWA)?

We talked at length about the benefits of PWAs. Now it’s time to show you some evidence. Here are five examples of Progressive Web App examples with positive impact.

Telegram

Telegram is a top-rated messaging app. Nowadays, it has over 700 million monthly active users. Their PWA makes the app accessible on a variety of devices. Also, it gives users the option to open it on their phone and computer at the same time. This action has increased user retention by 50% and almost tripled the number of active users!

Starbucks

Starbucks decided to develop a PWA for its online ordering system. Customers need an internet connection to place their orders. Yet, they can browse the menu and even customize their order while offline. The app is considerably smaller than the original iOS one. Moreover, it has helped Starbucks double the number of users placing online orders.

BMW

BMW developed a Progressive Web App to improve User Experience. The main reason for it was to show high-resolution images and videos to its users. Since launching its PWA, BMW’s click-through rates have increased by 30%, and the company has 50% more users.

Uber

Uber was looking to offer a great UX across all devices, launching their PWA in 2017. This switch enabled users to book cars even with 2G low-speed connections! Now 30% of Uber users make their bookings only on the web, and they only have to wait two seconds for the content to load.

The Washington Post

Most of The Washington Post’s readers access it through their mobile phones. Developing a Progressive Web App has made page loading considerably faster. This decision, in turn, has helped the newspaper substantially increase user retention.

Are Progressive Web Apps (PWA) the future?

Are Progressive Web Apps (PWA) the future?

Some experts believe PWAs have the potential to replace native apps. Are you wondering why? Well, native apps have many benefits, but they also have their disadvantages.

Users spend most of their time on a handful of mobile apps. Thus, getting them to download a new app is rather tricky, and 20% of potential users are lost in that process. Moreover, native apps are expensive to build unless you choose a hybrid one. Further, most of the time, users are happy with a good website experience. Thus, developing a native mobile app may not be worth the hassle. You can read more about this perspective here.

The truth is that PWAs definitely have a long list of benefits that make them worthwhile. Yet, other experts believe it is unlikely they could replace native apps anytime soon. Particularly given the current limitations in iOS devices. What most experts agree on is that PWAs are, indeed, the future when it comes to the mobile web. What's more, they're likely to replace traditional websites.

Conclusion

Progressive Web Apps bring a lot to the table. They considerably improve UX, cut costs, and are available for offline use. Although we don’t have a crystal ball, we certainly believe PWAs will continue to grow in the upcoming years. We hope this article has given you a helpful overview of PWAs and encouraged you to explore them in more detail!


PWAs offer an intriguing middle point between websites and native apps. The possibilities are endless! Further, they mean huge savings for businesses aiming to gain relevance in digital environments. Are you ready to develop your PWA? We've got an outstanding team ready to work with you! Join the vast list of clients who recommend our work. Also, check our content and showcase to know more about our approach. Let's shape the future together!

We are ready
to make your project happen

Let’s talk