Monday, December 25, 2017

What is Progressive Web App

Progressive Web App or PWA are mobile sites that offer functionalities of a native app. A user can access this site through any browser like a conventional website, but this site will store all the important information (interaction data) of the user like apps, helping you create a better experience for him the next time he returns to it.

Originally proposed by Google in 2015, PWAs have already attracted a lot of attention because of the relative ease of development and the almost instant wins for the application’s user experience.

PWA Definition by Google -  
“A Progressive Web App uses modern web capabilities to deliver an app-like user experience.” – Progressive Web Apps


Wait!!! PWA is a mobile site. Don't we have responsive sites that do the same thing.


Understanding the difference between responsive sites and progressive web apps

Responsive websites are designed to cater to audiences coming from different devices – the conventional desktop or any other type of mobile devices. The responsive sites are designed to fit into the screen that they are being accessed on.

Getting all the website elements to fit into a mobile display, requires businesses to sometimes strip a little functionality from the main site. This means you’re not truly offering a mobile first approach to your target market. While the responsive mobile site might serve the purpose up to 80%, a truly mobile centric approach is to add 100% of the functionalities progressively on the mobile site.


Why Progressive Web Apps?

Let’s understand what problems does any user face when installing a native mobile app -
  • Do I have enough space in mobile?
  • My available data is not sufficient.


The average size of apps that we install from play store/app stores would range from 30–200MB. Moreover, these app needs to updated every week!

Progressive Web Apps are within some KBs and are automatically updated.


Features of PWA - 

Progressive - By definition, a progressive web app must work on any device and enhance progressively, taking advantage of any features available on the user’s device and browser.

Discoverable - Because a progressive web app is a website, it should be discoverable in search engines.

Responsive - A progressive web app’s UI must fit the device’s form factor and screen size.

App-like - A progressive web app should look like a native app and be built on the application shell model, with minimal page refreshes.

Fresh - When new content is published and the user is connected to the Internet, that content should be made available in the app.

Safe - Because a progressive web app has a more intimate user experience and because all network requests can be intercepted through service workers, it is imperative that the app be hosted over HTTPS to prevent man-in-the-middle attacks.

Installable - Allows users to install the website as an app on their home screen without the taking user to an app store.

Some Popular Companies that Do Progressive Web Apps -


  • Ola
  • Flipkart
  • pinterest
  • Twitter
  • Alibaba
  • BookMyShow
  • MakeMyTrip
  • OLX
  • The Weather Channel
  • Forbes
  • JioCinema
  • Trivago