Progressive Web Apps

This piece on progressive web apps was written by Micho Ngoma, a software developer at Wrisasoft.

What are Progressive Web Apps?

These are applications that have been built using web technologies (HTML, CSS and JAVASCRIPT) that have a “Native App” look and feel on mobile phones. For example a web application can be installed and act like a Native App as the user becomes increasingly engaged with the experience.

How are they relevant to users, especially Zambians?

The answer is simple, saving on Data. One of the aims for mobile first applications is to save users on costly data bundles. With progressive web apps users get to save a lot of data, this is how it works:

On the first load, the browser with the help of a technology called Service Workers saves the most important part of the application which we refer to as “the app shell” on the device’s memory or cache. So the next time you open a link to the app it loads the app shell from the device’s memory and only goes to the network to pull the rest of the contents and the updated parts of the app. Another feature that is very interesting about progressive web apps is the fast loading capabilities. Progressive web apps are aimed at enhancinge user experience on the web and one of the crucial parts of that is how long the app takes to present the user with the content they need. Because the app shell is loaded locally, the loading speed of progressive web apps is very impressive.

As if this technology isn’t new, it is being supported by almost all major browsers including Microsoft Edge.

Some big companies have already started shipping progressive web app versions of their current applications. Below are some:

1. Flipkart
2. The Washington Post
3. Flipboard
4. Aliexpress
5. konga.com (Nigerian ecommerce Website)

Other startups have started taking advantage of this awesome technology as well. One example is WRISASOFT a Zambian company that developed a very simple currency status app “Kwacha”.

Why are they useful for Developers

As African developers we owe our clients and users to deliver cost effective applications. As we all know 99% of African internet users are data sensitive. If you have to compare native to mobile web you understand that a native app will costs a lot just to have it saved on the device and will still be costly to update.

Most people visit web apps more than they do install apps. But the challenge has always been data costs.  You need data to access the app and you can’t use the app when your device goes offline.

Progressive web apps is the solution to these problems. In summary the list below shows some benefits you will serve the user if you take this approach.

• Progressive – Work for every user, regardless of browser choice because they’re built with progressive enhancement as a core tenet.

• Responsive – Fit any form factor: desktop, mobile, tablet, or whatever is next.

• Connectivity independent – Enhanced with service workers to work offline or on low quality networks.

• App-like – Feel like an app to the user with app-style interactions and navigation because they’re built on the app shell model.

• Fresh – Always up-to-date thanks to the service worker update process.

• Safe – Served via HTTPS to prevent snooping and ensure content hasn’t been tampered with.

• Discoverable – Are identifiable as “applications” thanks to W3C manifests and service worker registration scope allowing search engines to find them.

• Re-engageable – Make re-engagement easy through features like push notifications.

• Installable – Allow users to “keep” apps they find most useful on their home screen without the hassle of an app store.

• Linkable – Easily share via URL and not require complex installation.

 To get started with progressive web apps you can go here. You can also watch the Progressive Web App summit which was held in Amsterdam last month here.

You can check out sample apps here just to have a feel of them.