Progressive Web App - Labidi Aymen
Aymen on 03/6/2017

Progressive Web App

Have you visited a website and you got a suggestion to install a related app or official application and  you resist ?

Things have been changed

A progressive Web-app uses modern web capabilities to deliver an App-like user experience.

Progressive web apps describe a collection of technologies design and concept, an web API that work together to provide  an app-like experience on the mobile web.

Let’s start with the powerful technology behind the progressive web app (PWA)


Service Workers

They power the basic of what a mobile app provide, like offline functionality, push notifications, background content caching and much more.

So how the service workers WORK ?

it’s just a JavaScript code that run on background independent of the application and runs in response to events like network requests, push notifications, connectivity changes …

Just like that.


App shell

It’s a  design concept whereby the initial load of a mobile web app provides a basic shell of a app UI, and the content for the app is loaded after, with this model we can improve the UX and the load time.


App Manifest

“Manifest” this word it’s not new for the android developer, how about this file (AndroidManifest.xml) Android developer ?

Yes you guess it, each install-able application need to tell the OS some info, in this case we need a manifest.json file and link it to the main HTML page (index.html) file to tell the browser that this Web-app is install-able



Progressive Web Apps (WPA) are equal parts new Web APIs, design patterns, also they push to the web developer, by using the web technologies anywhere to make an app-like web-app.

This may be interesting for you

There are 2 comments in this article:

  1. 03/8/2017tn_dev says:

    Thank you for this explanation,
    do you think that the progressive web apps will replace the native/hybrid/web apps ?
    specially with the ionic 2 , the angular 4 …

  2. 03/11/2017Aymen says:

    First thank you for your comment, actually it depends in the type of the project, if the project has a mobile and web-app that do the same things then go for Ionic, write once run everywhere, but if you need to focus just on cross-platform mobile app and you will use some complex animation or 3D things you will have some UI limitation, then go for Native frameworks like React-native or NativeScript(Angular and XML based UI), learning them is not hard as people think, they just need to get used to it.
    I hope i have clarified your question, and feel free to share your experience.

Write a comment: