Progressive Web App

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

 

Conclusion

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.


Last modified: March 06, 2017