Progressive Web Apps

By James Harrison on May 19th, 2019

What is a Progressive Web App?

A Progressive Web App (PWA) is a website that has been optimized in a way that makes is a comparable alternative to a mobile app downloaded from the iOS or Android app store. PWAs load like regular web pages, but offer additional native functionality, like notifications and working offline. In addition they can be installed on a user’s mobile device just like a regular app, With the advent of super fast 5G mobile networks, PWAs will become a contender to native mobile applications, and offer companies an alternative to costly native mobile apps.

To install a PWA, just browse to a PWA website and click “Save to home page” in the context menu, or the website may provide a button for you to click.  The app icon will then show on your device, and when run it will look like a native app and it will display in browser without search bar.

Benefits

  • All users have latest version
  • No need to download from app store.
  • Can work off-line (unlike websites)
  • One version works on all devices ( IOS/Android etc)
  • Lower development costs
  • “Findable by Google”

How it is different from regular app?

  • Designed in a native language for a single operating system
  • Fully customizable
  • Takes advantage of the device hardware
  • High performance

Progressive Web Apps

  • Built to be used in a common browser
  • Delivers in real time
  • Built using standard HTML, CSS and Javascript
  • Limited access to a device’s features
  • Network performance can affect users experience

How do they work?

A progressive web app is a website, that once installed on the user’s device, will act like a native app. It will have an icon on the device home screen, and when run will display in a browser but without the browser search bar or buttons (chrome) at the top. To the user it will look like a native app. It will also have some native app functions like push notification.
PWAs uses a JavaScript file called a service worker to store data from the website locally on the user’s mobile device. Depending on the complexity of the service worker, it can detect if the user is offline or online and when off line store the users input locally and then “catch up” with the server once the user is online again. Service worker stores app’s data and acts as a go between the app and the local cache on device and network storage.

More Information

More information on PWAs can be found here:

https://developers.google.com/web/progressive-web-apps/
https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps

Next Steps

Would you like us to build you a PWA that interacts with iMIS? If so please reach out to us on our contact page, we’d be happy to help!