Progressive Web Apps are a toolkit, not a recipe

Update: OK, they are a recipe too, but hear me out…

By Italian_Bicycles

The term ‘Progressive Web App’ is generally interpreted as a recipe for a bunch of features that must be combined together:

“…from what I understand, a PWA is a mobile web site with a service worker (ok), a home screen icon (this is not new) and push notifications (which nobody wants)”
- Progressive Web Apps — Yeh or Meh?

But as always with the Web, these technologies are optional and it’s up to you to combine them in the best way you see fit.

If you want to make a web experience that can respond offline and can have its own homescreen icon on mobile, that’s great. If browsers detect this, they might help to encourage your users to save your app to their homescreen by showing special icons and banners.

This doesn’t mean that you’re forced into applying a whole set of features though. It’s not all-or-nothing; you’re free to cherry-pick. For example, if you don’t want to introduce push notifications, you don’t need to! The only reasons that push notifications are mentioned so often in terms of PWAs are:

  • When used appropriately, they can be very effective for re-engaging users. See the stats and case studies here and here, for example.
  • They’re an example of the new kinds of functionality that are powered by service workers — a fundamental feature transforming what’s possible on the Web. As well as letting web apps work offline and respond to push messages, they also lay the groundwork for other great features such as background sync.

UX over checklists

Tools like Lighthouse are great, but there’s a risk that we focus too much on ticking all the items off the checklist and too little on our user experience. Instead of getting caught up around a set of features that specific tools or browsers recognise in different ways, it’s better to consider which features can enhance the experience for your users.

Apply those that make sense for you, not just those you think will make it a ‘PWA. As Frances Berriman said about the terminology: “worrying about it is a distraction from just building things that work better for everyone”.

A toolkit, not a recipe

Instead of thinking of PWAs as a recipe, let’s think of them as a toolkit. A toolkit that contains the key capabilities of native apps. A toolkit we can use to improve people’s experiences on the web.

“…my main complaint with PWAs: that they’re marketed as some brand new great thing, when really it’s just a handful of new features for the web”
- Progressive Web Apps — Yeh or Meh?

PWAs may be “just” a handful of new features for the web, but it’s a powerful new set. We think they deserve to start a new chapter for the Web.

Update: After being involved in this thread with Alex Russell and Sacha Grief, I wanted to add that some browsers and tools do check for a PWA ‘recipe’; they provide additional features if you combine the basic technologies (essentially service worker + web app manifest) together. I’ve since written about this in “Here’s what you get for free with a Progressive Web App”. Hopefully together these posts provide a broader perspective: you don’t have to follow the recipe, but if you do, this is what you’ll get.