PWA - Progressive Web Apps: web made easy, reliable and fast
Hi there we are back again and we've got something very exciting to show you. Its called PWA - Progressive Web Apps, this was introduced by Google back in 2015, and according to the impact it has made in its infancy, it is supposed to be the next big thing in the tech industry.
We all know there is an exponential increase in number of cellphone users recently, and because of this there are a lot of types of mobile devices to satisfy this demand, but this can become a headache when it comes to building Mobile Apps that can support so many platforms and form factors. Also it should be ensured that the experience of the User is seamless.
There is one more thing to notice, there are in all 2.6 Million Apps on Google Play Store and 2.1 Million Apps on App store so basically there is an app for anything that you want, but users do not want to install an app for every little task that they want to accomplish, so they tend to use a website for such tasks. But then again websites do not offer all the features that native apps do.
So ? What does PWA has to do with all this ?
Well, the best way to describe this is "PWA takes the best of both worlds", it provides a seamless, immersive experience of a Mobile App with an ease of just visiting a website, no app downloads/installs required.
What does it means to Businesses ?
- Every business has a website, but customers do not want to have an app for every market activity that they want to perform related to these businesses, so they prefer websites. Also there are countries which have low per capita income having a high cost of internet, people here are very data sensitive so they want to install a full app only when its very much required.
In such cases, PWA can help:
1. PWA's are lightweight, their initial load time is faster and their subsequent loads are even faster.
2. PWA's provide native like experience.
3. PWA's can reduce the steps between the discovery of an app and getting it to home screen of a user, which means more user engagement.
4. PWA's being websites have indexability, i.e. its content is indexed on search engines, so SEO is also a possibility.
One of the best example of such adopter of PWA is Konga - a Nigerian e-commerce company in South Africa.
What does it means to developers of Web Apps ?
- Its a write once run anywhere type of thing - which we could probably guess developers would love this best. You just have to write the code once and it will run on almost all devices.
- When ever there is a need for providing any updates to user, you just have to do what you already currently do - deploy the Web App to live server and that's it, rest will be automatically taken care of. User's will start getting the updated app.
What does it means to Users of Web Apps ?
- PWA's could work offline:
which could enable a user to save cost,
use the app even when there is no or low network coverage.
- PWA's provide native like Experience, it hides the browser UI controls and appears like an app.
- There are no downloads/installs needed, if you visit a website/webapp often and its a PWA, browser will provide a pop at the bottom as shown below,
- You will never need to update the app, it will update automatically in the background, so everytime you open it, you can be sure its always the latest.
- Getting the app to the home screen is as easy as a single click on the pop up that appears on the website which you visit often and is a PWA.
Ok ! But how does it all works ?
The magic sauce is Service Workers. But they are not humans workers.
So what are they ?
- According to Google: A Service Worker is a lightweight, network proxy that intercepts network requests and provides cached resources should those network requests fail.
- They store and update the website/webapp in the cache.
Back to the main topic, how does it all works ?
- Firstly a website/webapp should have three things to be a PWA, (for details click here):
a manifest.json file
a service worker
and some user engagement i.e user must have visited the website/webapp a few times
- When the above conditions are satisfied, browser will display a popup at the website/webapp to add it to homescreen, which developers or users have no control of.
- User clicks the popup and service workers will start their jobs, they will make the site offline and will constantly monitory it and will reliably and intelligently update the content in the background.
But, there is a catch!
We know not everybody enjoys the ugly part when they are so overwhelmed with good things, but every coin has two sides and here is the other side of PWA.
- PWA's to work seamlessly over all the devices has to be designed like water, it should fit every container, but this is not very easy to achieve.
- Not all browsers support PWA's.
- Not all devices support PWA's.
- Currently as of now, PWA's cannot access other native apps for things like authentication, but this may change soon.
What's Next ?
- There is this great video on the present and future of PWA's on youtube, its google io 2019, click here to go to youtube. We think they are the best person who could answer the given question.
- There is a website "pwa.rocks" which itself is a PWA, which lists some PWA's which are currently persisting in the market.
Ending with a quote:
Life is not to draw conclusions, conclusions are the end of exploration, keeping what we found out of life until now, we should keep exploring life in every possible dimension