Progressive(ly) taking over the world: One device at a time

This year (2018) brings great things for all front-end developers with much wider browser vendor adoption for Progressive Web Applications through service workers.

We at Global Kinetic have already embraced this enhancement by starting work on our first Progressive Web Application with our resident PWA experts Chamir and Hendrik.

What is a Progressive Web Application?

Progressive Web Apps are just great web sites that can behave like native apps. They can also be described as  great apps, powered by Web technologies and delivered with Web infrastructure.

More on this here -> Windows Blogs

A web application that is installable to the home screen (The home screen of your mobile device, or your desktop), which is available even when offline. Through service workers, Progressive Web Applications can send push notifications to the user’s device directly, too. Installable, you say?

Yes, it is true. When visiting a Progressive Web Application on your mobile device, after it has been cached you will receive a prompt to add it to your home screen. This installs the application on your device, and it then behaves like a native application, even opening in it’s own window.

On desktop devices Progressive Web Applications can also be installed, which will add a shortcut on your desktop that will open the application in it’s own window.

PWA

Offline availability

A Progressive Web Application can cache all application files and data through the use of the Cache API and IndexedDB. The Cache API can cache all assets (HTML, Javascript, CSS, Images, Fonts) and then use the cached versions instead of re-fetching them from the server on each page load.

IndexedDB is a browser object store that can store all data in plain objects. This data can then be used to sync when that application comes online again.

What about updates?

Updates to Progressive Web Applications are automatically downloaded in the background when any change to the service worker is detected. The next time the application is opened the latest version will be used. No more app store updates, just a seamless user experience.

How do I build my own?

The best place to start would be to follow along with a tutorial, the Google Developer article is full of information and takes you through building a real application from start to finish. Once you have mastered the basics it is highly recommended to take the time and read through the Building Progressive Web Apps book by Tal Ater.

This book is very in depth, and should give you a good understanding of the ideology and mechanisms.

Browser support

Google Chrome and Firefox have supported Progressive Web Applications for a while now. Microsoft Edge has come to the party and have very recently announced service worker support in the Edge preview builds.

They have also said that they will soon start crawling the web and are planning to add Progressive Web Applications directly to the Windows 10 store.(Source.)

Chromium has also announced a while ago that they are removing support for installed Chrome Apps in favor of Progressive Web Applications. (Source.)