Around 10 years ago, there was an famous ad campaign for a mobile phone company with the catch-phrase “There is an app for that”. The concept was that for many tasks, activities or even games that were traditionally paper or full computer based could now be expressed as “apps” that could be run on mobile devices.
To create a mobile app, developers would need to learn and understand the various languages and coding tools, sometimes using very proprietary technologies for various platforms.
The tools have evolved over the years, making creating mobile applications more accessible to not only to professional developers but to low-code/no-code makers as well.
One concept in the creation of apps is also build web applications and web sites that are also mobile-friendly, meaning visitors to a web site can easily view and navigate a web application as easy as they can on their desktop.
Progressive Web Apps
Another technology concept that is beginning to gain popularity are Progressive Web Apps, or PWAs. In the very simplest sense, a PWA is just a web app that is optimized to run “like an app” on a mobile device. So they appear to be a like a native app that you would install from your device’s app store, but actually work within a standard browser. From a development perspective, if you know how to create a web application using HTML, CSS and JavaScript (and now Power Apps portals) you can use these same building blocks to build a mobile application.
So what is difference between a Progressive Web App and an a web app running in a mobile browser?
Offline mode
PWA technologies allow for some mobile app features that are not necessarily available to a standard web app, such as offline availability. A PWA can be configured to continue to run on a mobile device when connectivity is lost or put in an offline mode. There are a variety of technologies at play such as service workers, cache APIs, and web storage APIs. A PWA can potentially operate both online and offline without “page not found” errors. In some PWAs, you may get an offline message, but still be able to elegantly navigate the app.
Native App Look and Feel
A PWA app can be installed easily by navigating to the URL in a browser and then adding the app to the devices home screen. Essentially this is just a browser bookmark, but the link instead will act more like a native mobile app.
App Stores
A PWA app can be deployed and installed via a mobile devices app store. This also gives the feel of a native application. Once of the benefits of it being a web app is that updates can be automatically applied as opposed to installing an update separately.
Real-time Content
Since the app is essentially a web site, when online you would see the most updated data (consider an inventory app or a news feed) vs a dedicated mobile app that could potentially have stale data.
Installation and Storage
A PWA is really just a link to a website, so it will take considerably less resources than a fully-installed app and be available immediately. Note that the PWA may use a lot of space for offline storage, but a well designed app should minimize the amount of offline data required.
Another big benefit is that you don’t need to create an app for a specific platform. A PWA could be created for iOS, Android, Chrome or other platforms by just creating one web app.
PWA vs Native Apps
At this point there are certain device APIs (camera, location services, accelerator detection, etc) that are difficult to access via a web app, so in these situations, a native application might make more sense. However, as the technology evolves, these too may eventually be accessible via a PWA.
Progressive Web Apps and the Power Platform
Microsoft has announced the public preview of enabling Power Apps portals as Progressive Web Apps. You can read the announcement blog here and check out how to enable your Power Apps portal as a PWA here.
There is also a video overview here.
While there are some limitations (such as not being able to interact with Dataverse info offline) this does provide yet another tool for organizations to provide external users with another platform of interaction and provides an easy way for Power Apps makers to easily and quickly create mobile applications for external stakeholders.
I followed the instructions and was able to build a simple “Powerlifting Training” app that I deployed to my iPhone. This didn’t require any installation of the Power Apps app and since there was no authentication it will only consume page views from my Power Apps licensing. This app required no code and looks and feels like a (simple) native mobile application that I can launch from my home screen.
While I can’t take Dataverse information offline, I could view any static information in an offline mode. At this point I haven’t tested a portal with any code components that might interact with device specific features (like the camera?) so I am not sure how possible that is at this time. The app itself can act like a native app and the users might not ever realize it’s actually a Power Apps portal.
I am curious to see what potential applications the community comes up with using this new feature.
Resources:
https://www.codecademy.com/resources/blog/what-is-a-progressive-web-application/
https://web.dev/what-are-pwas/
Cover Photo by Rodion Kutsaev on Unsplash
App Photo by Luis Villasmil on Unsplash
Nick Doelman is a Senior Content Developer for Microsoft, however, the views, opinions expressed in this post are of his own and not of the Microsoft Corporation. Nick is a former Microsoft MVP and still enjoys being involved in the Power Platform community. Follow Nick on twitter at @readyxrm
ReadyXRM 
One thought on “What is a Progressive Web App?”