You might have noticed visiting certain websites now prompt you to ask for permissions to push notifications on your desktop as well as on smartphones. Google has recently been championing the initiative called Progressive Web Apps (PWA) – learn all about them here.
Lodged somewhere in between mobile apps and websites, progressive web apps are generally designed to look and feel like a mobile app, but served over the internet like a regular website. What’s different from ordinary web pages however, is the fact that PWA’s cache visited pages and database queries, enabling users to browse through the app even offline.
Contents
Differences
| Website | Progressive Web App | Mobile Application | |
| Offline | NO | YES | YES |
| App stores | NO | NO | YES |
| Responsive | YES | YES | YES |
| Searchable | YES | YES | NO |
| Local Notifications | NO | YES | YES |
| Push Messages | NO | YES | YES |
| Download to install | NO | NO | YES |
| Fast Updates | YES | YES | NO |
Digging deeper
This is what you currently see if you are offline in Google Chrome on a desktop computer, and have been browsing a website.
Not very nice is it?
Not very nice at all, and the website you were visiting disappears completely, even though you technically are likely to have a cached version of the website on your local storage.On the other hand, mobile applications have always had better user experience when their users aren’t connected to the internet – that’s sort of the point with apps. Indeed, one of the main reasons for using mobile applications have been to allow users without internet access a way of finding information, browse through images and so forth.However, with progressive web apps, if the website is setup with a Service Worker, and follows 3 other important rules, visiting the website will prompt the users to add the site to the home screen on Android devices, and keep the previously shown content instead of the error page.
Add to Home Screen
Once users have added the PWA to their home screen, users can now access the website via an icon, just as they would a normal app. And if they are not connected to the internet, the PWA will show the last retrieved data for each page previously visited. If there is an online connection however, the PWA will function as a normal responsive webpage.It is possible to style the progressive web app differently depending on whether or not there’s internet, and it’s possible to simply display an offline message, or to show cached content. It’s even possible to manipulate, filter and edit the cached data based on new user inputs, meaning that in theory, the PWA could download necessary information without the need for users to visit specific pages, allowing the complete access even without internet.
Issues
So it appears that PWA’s are basically the best of both worlds, except for a few problems:
- No universal support (Only Chrome & Mozilla support currently)
- No access to certain hardware features
- No entry in Google Play Store
- Apple has shown no interest in extending their browsers and devices with this functionality
These are valid reasons to keep on waiting with developing a new PWA or expanding existing websites/mobile apps with PWA solutions.However given the initial success, and, perhaps more importantly, given the incredible user experience this provides, chances are that universal support will come, and that Apple will open their eyes and minds to adding this feature on both macOS and iOS, as well as support Service Workers in their Safari browser.
One glaring thing remains, App Store support. Since the PWA’s are hosted on website servers, doesn’t require submission/approval, and are able to be updated or completely changed overnight, it is not likely that we will see progressive web apps being featured alongside regular mobile applications anytime soon.Of course, there are a few supposed solutions to keeping safety high while allowing developers to add PWA’s into Google’s Play Store and Apple’s App Store, but for now it looks as though the increased exposure and credibility the apps stores lends mobile apps, are reserved for just those.
Requirements
In order for your progressive web app to prompt users to add to their home screen, the following 4 requirements must be implemented.
- Valid JSON Manifest installed
- Secure HTTPS connection
- Valid Service Worked installed
- And in order for the prompt to appear, the website needs to have been visited at least two times.
It’s worth noting that most of the work involving PWA’s revolves around service workers, as they are the application core, serving pages, caching content and managing offline and online connections.
Conclusion
For now, there aren’t too many use-cases where PWA’s can really shine, although there certainly are some already. If the majority of your users are visiting through Chrome, and your content lends itself to be cached offline there’s certainly things to be said for developing a PWA.
However, most websites or mobile applications today have a variety of users, connecting from all sorts of devices and browsers, and by spending time and resources on developing a PWA which might only target 25% of your users, one has to wonder whether it would be the best investment, or whether it would be wiser to wait for better support from other browsers and operating systems.
Author Bio: Having more than 15 years experience in the world of web and app development, Mark Pedersen has been on the forefront of open-source development ever since coming across PHPNuke back in 2001. He has since moved on to first Joomla, before settling on WordPress for web development, and lately he has been working exclusively with app development, being employed at Nodes, a UK-based app agency.
