Progressive Web Apps

A Software Methodology
What is PWA?
● Progressive Web Apps are user experiences that have the reach of the web,
and are reliable fast and engaging. (Google Devs)
● Progressive Web Apps (PWAs) are web applications that are regular web
pages or websites, but can appear to the user like traditional applications or
native mobile applications (Wikipedia)
● Progressive Web Apps are just websites that took all the right vitamins.
● web page with all the ‘right vitamins’ so that it can behave more like an app
downloaded from the App Store/ Play Store.
● It starts as a normal web page in a browser, and as a user explores the
webpage, they get the prompt if they would like to “Add to Home Screen”.
● Once the user gives the thumbs up to this prompt, PWA gets added to their
home screen.
● Once open from the home screen, it can even hide the browser UI controls
and appear as an app.
● More than 40% of the users bounce from the websites that take more than 3
seconds to load. PWA is a solution for this “Web Obesity Epidemic” faced by
the users.
● It is all about removing friction and making it easy for the users to get to what
they want.
Why do we need a Progressive Web App?
● Challenges with native apps and web apps.
○ Internet speed
○ Slow website load
○ High friction
○ User engagement
The three baseline criteria for a PWA
● You need to be running under HTTPS
● You need a Web App Manifest.
● You need a Service Worker
Service Worker
● Backbone of every PWA
● A script that the browser runs in the background separate from web page
● Enable reliable and intelligent caching, background content updating, push
notifications and the most attractive offline functionality to prior visited sites.
This means that, after the first visit to a website, the site and app will be
reliably fast even on flaky networks.
PWA in a nutshell
● Reliable : Fast loading and works offline
● Fast : Smooth Animations, jank free scrolling and seamless navigation even
on flaky networks
● Engaging : Launched from home screen and can receive push notification
● Integrated user experience : behaves like a native app
Challenges in PWA
● Cross Browser Support
● Limited Functionality
● Limited Legitimacy
● Cross Application Login Support
Handle failed network requests
Example
https://themanifest.com/app-development/11-examples-progressive-web-apps.
Are Progressive Web Apps the Future of Web
Development?
● They cost nearly 10 times less than a mobile app.
● The only catch is, progressive web apps are not yet supported on all browsers
or software. For example, they can’t use features such as GPS or fingerprint
scanners.
● But you never know; technology progresses at such a rapid rate. Sooner or
later, progressive web apps will break down these barriers, and then, they
might just become the future of web development.
Conclusion
● We can’t say that PWA will kill Native Apps in the future. But still there is a
growing interest for this approach in the community. PWAs are still in their
infancy with a lot of challenges to be addressed. Yet, they have the potential
to create a shift in the way the web works.
References
https://medium.freecodecamp.org/progressive-web-apps-101-the-what-why-and-h
ow-4aa5e9065ac2
https://gauntface.github.io/simple-push-demo/
https://developers.google.com/web/updates/images/2015/12/getting-started-pwa/p
wa-general-0-@1x.jpg

https://alistapart.com/article/yes-that-web-project-should-be-a-pwa/

https://www.pwabuilder.com/imageGenerator

https://www.pwabuilder.com/

https://medium.com/@deepusnath/4-points-to-keep-in-mind-before-introducing-pro
gressive-web-apps-pwa-to-your-team-8dc66bcf6011