Progressive Web Apps: Apple App Store, Google Play Store, It Was Nice Knowing You

Is the end coming for the Apple App Store and Google Play Store? The title is obviously an exaggeration, but in all seriousness, the time has come for a new wave of mobile technology to come to the fore. In 2018, Twitter announced that it has started offering its mobile PWA as its main site. PWA? What’s that?

Progressive Web Apps (PWA) is the future of mobile apps and the web, pushed by heavyweights in the industry especially Google. With features such as adding to home screen, offline support, push notifications and more, a PWA offers a user experience approaching that of a native mobile app.

Here’s how a PWA works. Imagine you have a Customer Relationship Management (CRM) app that is also PWA compliant. You just need to visit the app using a normal URL in your mobile browser. If you have visited the app more than once, the PWA will prompt you to “Add to Home Screen”, which is basically equivalent to “installing” the app.

Add to Home Screen Prompt

Once installed, the PWA icon appears as an app in your phone. Launching the app will display a splash screen, and the app is then displayed in a full window without a browser navigation bar.

PWA Icons

PWA Splash Screen

PWA User Experience

With smooth app transitions and fast page loads, the line between a PWA and a native app user experience is blurred, especially when it supports background push notifications and some offline capabilities.

Background Push Notification Support in PWA

PWA support in various platforms are improving all the time. Chrome on Android has been supporting PWA for a long time, while Apple has added PWA support in iOS 11.3. But… there’s always a but, isn’t there? In order to qualify as a PWA, Google provides a Progressive Web App checklist. The checklist details the required criteria, and there is a whole long list of items to pass the audit. The Chrome browser embeds a developer tool called Lighthouse which automatically audits a web app for PWA compliance. The Lighthouse baseline audit includes checks such as:

1. Page load is fast enough on 3G
2. Responds with a 200 when offline
3. User can be prompted to Install the Web App
4. Uses HTTPS
5. Has a <meta name=”viewport”> tag with width or initial-scale
6. Registers a service worker
7. Contains some content when JavaScript is not available
8. Configured for a custom splash screen
9. Address bar matches brand colors
10. Content is sized correctly for the viewport
11. The short_name won’t be truncated on the homescreen
12. Site works cross-browser
13. Page transitions don’t feel like they block on the network
14. Each page has a URL

The screenshot below shows an example result of a Lighthouse Progressive Web App audit:

Lighthouse Progressive Web App audit

So while the promise and utility of PWA makes it extremely enticing, developing PWA apps is typically not an easy task with all these requirements, especially when dealing with service workers which are a key part of PWA.

Recognizing the importance of PWA in the years ahead, Joget DX apps automatically incorporate PWA features (including service workers) so that all apps will be PWA baseline compliant without requiring additional steps. Joget DX is an open source application platform for faster, simpler digital transformation (DX). With a no-code / low-code approach Joget DX allows anyone, business or technical users alike, to rapidly build full-fledged enterprise applications. The screenshots of the PWA earlier actually shows a Joget DX app, developed using a visual drag and drop approach.

To know more about Joget DX, check out the Joget DX introduction article.