Why Progressive Web Apps

Vivek Madurai
Feb 17, 2018 · 3 min read

This article is in continuation with my previous article on Mobile Web vs Native App, its very clear that mobile web get more number of new visits when comparing to installing new apps. But due to web apps reliability in slow network and low in engagement users churn out quickly.

Image for post
Image for post

In this article we will be seeing why we need PWA and how it helps web application to be Reliable, Fast and engage users like native apps.

Lets start with what wrong is native app,

Image for post
Image for post
  • High cost involved in building and delivering individual native apps
  • Difficultly in sharing the information to outside world.
  • Reaching to larger audience by SEO is not possible
  • Cost in getting a user to install your app is high(acquisition cost)

Whats wrong with web app,

Image for post
Image for post
  • Apps reliability due to slow mobile network
  • User experience like smoothness, animation
  • Offline access
  • Low in engagement(no push notification)
  • No access to device hardware

Why PWA,

  • Combines best of the web and best of the apps
  • Reliable and loads quickly as native web app, but delivered through the web
  • They roll and animate smoothly, they can engage users via push notification
  • They are integrated as part of mobile home screen and can be loaded as top level full screen app
  • PWA helps mobile web in achieving native apps capability
Image for post
Image for post

How PWA works, technologies used to build a full fledged progressive web applications are,

  • App Shell architecture (Loads Instantly)
  • Https (Security)
  • Service Worker (Caching)
  • Web App manifest (Visibility)

Application Shell or App Shell architecture is the minimal HTML, CSS, Image and javascript needed to power your initial user interface, static assets needed to render your first paint. If you are building a modern single page application(SPA) then you would definitely have something similar to this which we are calling it as App Shell. These static assets can be cached at first visit via service workers so that they get loaded instantly on repeated visits.

A service worker is script that runs in background, separate from that of your web page. Service worker can intercept a network request made for a page and returns a response retrieved from the server or retrieved from local cache. It helps in caching your app shell and data, so that the app can work in online as well as offline making reliable and smooth user experience. If you are interested in lifecycle of service worker click here.

The Web App manifest is a metadata defined as JSON file which gives ability for the developer to save a sites’s bookmark to users home screen. It has unique icon and name so that users can add a visibility of your app to their home screen like native app icon. This also includes things like splash screen, theme color, display mode, orientation etc., to make better appearance in launching your app.

Butterfly Effect

Stories from our teams in marketing, sales, engineering, product and more!

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store