In this blogpost Frank explains what Progressive Web Apps are, how they can help you drive engagement with your end-users and how we've implemented them for Open Social.

According to a report by Gabor Cselle you stand to lose 20% of your potential users with every step they have to take to get added value out of your app. For example, first: the users needs to find your app and download it. Then, the user has to start the app and create an account to use some or all features. Then, the user needs to be asked permission for receiving notifications. And so on and so forth. 

User loss through traditional (mobile) apps, by Gabor Cselle
User loss through traditional (mobile) apps, source: Gabor Cselle

What is a Progressive Web App?

‘Progressive Web App’ is an umbrella term used to describe certain (mobile) web experiences that compete with app experiences. They bring features we expect from (mobile) apps to the (mobile) browser). On the whole, the term ‘Progressive Web App’ describes a collection of technologies, design concepts and APIs that work in tandem to provide a (mobile) app-like experience on the (mobile) web.

What makes these web apps progressive?

Tal Ater wrote a very good example of why these web apps are progressive in his book.

Imagine waking up one morning and visiting the website of your local rail company. You take out your phone, check the train schedule, close your browser and put your phone back in your pocket. At the end of the day, you revisit the website and check when the next train departs. You don’t even notice that the elevator you’re on has no reception, because the site works even when you are offline. 

The next morning you when visit the site again it asks you if you want to save it to your homescreen. Later that day, when you launch the website from the icon on your home screen, it lets you know there are delays and asks if you’d like to receive push notifications about future delays. The next morning, as you are waking up, you receive a push notification that your train has a 15 minute delay and hit the snooze button. 

What started as a simple website has slowly gained new powers until it was as capable as any native app. Instead of trying to force you to the app store, hoping for an install, the rail company has earned a permanent place on your phone, one step at a time. But what exactly provides these “progressive” powers to your web app?

Where the magic happens: ‘Service Workers’

What makes these web apps progressive, is that they figure out you’re a returning visitor and adjust to your behavior. You didn’t even notice there wasn’t any reception in the elevator, because the website still worked. It asks you if you’d like notifications after you opened it several times within a certain time span because it ‘knew’ you’d probably say yes. The service worker is responsible for all of this. 

A service worker is a script running in the background of your browser. It runs separately from the web page. One of the reasons service workers are so powerful is that they give you the ability to intercept and handle network requests. This is a very exciting feature because this way you can integrate offline experiences. 

This is only the beginning 

Need more reasons to develop Progressive Web Apps instead of native apps? Progressive Web Apps are gaining more and more terrain is because users are downloading less and less native apps. Progressive Web Apps are gaining support for native features that were only be available to native apps, for example working offline, quick add to the home screen, launching in full screen, clipboard access, etc. etc. 

There are some things you can’t do yet (!) with a Progressive Web App, such as accessing contacts, calendar and browser bookmarks, alarms and low-level access to hardware features like the device flashlight. But this may change soon. 

It’s much easier to distribute a Progressive Web App. If it’s online, it’s accessible for any mobile device. With traditional apps you need to develop for iOS and Android and then create a website and marketing plan across all app stores, while at the same time keeping your app in sync and up-to-date! This makes a Progressive Web App almost a no-brainer. If it turns out there is still a market for a native app, you can always invest and develop one. Once Safari has support for service workers most likely all apps will be Progressive Web App.

Increase your user engagement on Open Social

So how do we use Progressive Web Apps for Open Social? For one thing, push notifications are a great way to help increase user engagement for your Open Social community. You can view a demo of our Progressive Web App module below:

Further reading

Why progressive web apps vs native is the wrong question to ask - Dan Dascalescu (Developer advocate @ Google)

250+ Communities are powered by Open Social

Don't miss our posts

Nov 13, 2017 - Security - Drupal Community - Open Source

Embracing Open Source Security with Drupal

Open source security for online community platforms is important to us at Open Social. Here’s an overview of open source security, and why it’s important that we’re covered by the Drupal security team.

posted by Natasha
Nov 02, 2017 - User Experience - Community Building

Why Use Mentions (@) to Boost Community Engagement?

Community engagement breathes life into a community and results from vocal, passionate members. Open Social’s mention feature makes it easier for members to engage and connect with each other.

posted by Evelien
Oct 30, 2017 - User Experience - Community Building

Improve Your Community’s Accessibility

Web accessibility ensures that everyone has equal access to content on the web. Here are few actions that community managers can take to make their community accessible to everyone.

posted by Bas