Progressive Web Apps (PWA) allow web applications to have app-like capabilities by being installable, load quickly, and work offline or on low quality networks. PWAs use service workers to cache assets and API responses so that the app is able to function with limited or no network connection. Other features of PWAs include being responsive and being able to re-engage users with push notifications. The document provides an overview of PWAs and their capabilities as well as links to learn more and examples of existing PWA implementations.

1. Progressive Web Apps (PWA)
An Introduction
By: Sandip Nirmal
sandip.nirmal@synerzip.com

2. Contents
● Web Application
● Progressive Web App
● Taking App Offline
● Making app installable
● App Demo
● Browser Support, etc

3. Web Application
“Web application or web app is a client–server software application in
which the client (or user interface) runs in a web browser”
- Wikipedia
● Connectivity Dependant
● Non installable

4. Progressive Web App
● Offline first
● Installable
● Safe
● Responsive
● Re-engageable
● App-like
● etc

5. Taking App Offline
● Service Worker are
● event-driven script contexts that run at an origin.
● Sits in between origin and internet
● Acts as a proxy
● Caches API are
● New Storage API
● Can store any content (served over the web)
● Developer has entire control over it

6. Service Worker Registration

7. Service Worker events (install)

8. Service Worker events (fetch)

9. Service Worker events (fetch)

10. Service Worker events (activate)

11. App Installation
● App manifest
● App icons
● App orientation

12. Demo App (Android)

13. Demo App (iOS)

14. Browser Support
● Chrome - Desktop and Mobile (Android)
● Firefox - Desktop and Mobile (Android)
● Microsoft Edge - Windows desktop and Mobile (Under Development)
● Opera - Desktop and Mobile (Android)
● Safari - MacOS and iOS (Under consideration)
● https://jakearchibald.github.io/isserviceworkerready/

15. Testing (Lighthouse)

16. Why PWA
● 55% of entire web traffic is from mobile devices
● Browser supports native features (https://whatwebcando.today/)
● Reduced development efforts
Current (web/desktop + android + iOS + windows)
With PWA (PWA & iOS)

17. References (Getting Started)
● https://www.udacity.com/course/offline-web-applications--ud899 (Free course)
● https://developers.google.com/web/progressive-web-apps/
● https://jakearchibald.com/2014/offline-cookbook
●Example Apps
https://pwa.rocks/
https://www.chromestatus.com
https://flipkart.com
https://housing.com

18. THANK YOU
Demo App : https://sandipnirmal.github.io/weather-app-PWA
Code Repo: https://www.github.com/sandipnirmal/weather-app-PWA