What’s a progressive web app (PWA)?
A progressive web app is a special type of web application (a software application that you use in a web browser). It maintains some functionality even when you’re offline. It can also be installed, like an app, on your cell phone.
Why take the trouble to develop a technology that makes it possible to use a web app offline, and make it act like an installed app on your cell phone? This may not seem useful, at first glance. Many web applications, like gmail, started out at home in a web browser, being used on a desktop computer. On desktops, you’re usually working online, so why take the extra effort to deal with the rare Internet outage at home?
Well, more and more people are using web apps on mobile devices. Even if you live in a heavily populated area, you may find that once in a while you get no Internet service on your cell phone. For most applications, that puts a hard stop to many of the uses for your phone. It’s frustrating for users. In some cases, a web app doesn’t really need a constant Internet connection to be useful. For example, you may want to visit your email client in a web browser to write an email even if you’re offline. You can queue up the draft to be emailed later, when you enter an area where data service is available.
This is where Progressive Web Apps (PWAs) enter the picture. If you run a web application that could be useful to people even when it’s offline, it can make sense to turn your app into a PWA.
Why Not Build a Native App?
If you’ve already built a web application, you could also build a native app for your users (an Android app, for example). From the provider’s viewpoint, this can be a big project – building a native app requires an entirely different set of development skills from web development, and it’s an additional cost. Aside from that, there’s a hurdle for users to install a native app, even if you’ve taken the trouble to build one. They have to go to the Google Play store, search for the app, wait for it to download, and then they might find that it’s not used very often or it’s just taking up space on their phone, so they wind up uninstalling it.
What if it were possible to download a “light” version of an app directly from the web app’s website? That’s what you can do if you build a PWA.
Properties of a PWA
According to Google’s Developers site, my PWA must fulfill some requirements:
- It must run in a web browser and as an app in mobile devices.
- It must be “fast and reliable” (even native apps aren’t always fast and reliable, so this requirement is a bit funny!). This just means it loads really fast, and does something useful even if you aren’t connected to the Internet. No “ERR_INTERNET_DISCONNECTED” errors like you’d get when your browser is offline, please.
- It must be installable. When installed, it appears in Android’s “Apps drawer” (where all apps are listed), and you can add a shortcut to it on your home screen (or desktop on a PC). When running on a mobile device, it’s a top-level app in the task switcher.
What you want, more than anything, is just to make sure that the web app does something useful when the user is offline. Instead of seeing a blank page with an error message, you get some functionality. You also want it to be easily accessible (hence installable) for people who will want to use it frequently.
How to Build a PWA
I’ve written a page which explains how to build a PWA, step by step. Take a look there if you’d like to follow the tutorial.