PWA are everywhere.

1. Progressive Web Apps
“Write once run everywhere”
@Amandeep Singh

4. Downsides of Native Apps
- High Development and Maintenance cost
- High Acquisition and installation cost
- Reaching to larger audience by SEO is difficult

5. Downsides of Mobile Web
- Apps reliability due to slow mobile network
- User experience like smoothness,
animation
- No offline Experience
- Low in engagement(no push notification)
- No deeper integration to device hardware

6. Mobile Native Apps Mobile Web Apps

7. In 2015, designer Frances Berriman and Google Chrome engineer Alex Russell
| coined the term "progressive web apps"

8. So what is PWA?

9. According to Alex Russell(Google Chrome Engineer), PWAs are::
| Just websites that took all the right vitamins

10. What makes PWA like Native?
- Web Manifest
- Service Workers
- App Shell Model

11. Web App Manifest(manifest.json)

12. Service Worker
Flow diagram for Service Workers intercepting network requests

13. Service Worker

14. App Shell Model
Cache Instantly loads App shell on repeat visits Dynamic content then populates

15. Its demo time..

18. Load time reduced from 11.91 SECONDS to 4.69 SECONDS
90% SMALLER than Tinder Native App
Success Stories

19. Takes less than 3 SECONDS to load even on 2G NETWORK
Success Stories

20. Limitations
https://whatwebcando.today/

21. The PRPL pattern (Enhancements)
PRPL is a pattern for structuring and serving Progressive Web Apps
(PWAs), with an emphasis on the performance of app delivery and launch.
It stands for:
● Push (or preload) the most important resources.
<link rel="preload" as="script" href="super-important.js">
<link rel="preload" as="style" href="critical.css">
● Render the initial route as soon as possible.
● Pre-cache remaining assets.
● Lazy load other routes and non-critical assets.

22. Audit your page with Lighthouse

23. PWA now available via Google Play Store
[Progressive Web App Update 2019]

24. PWAs ARE EVERYWHERE

25. Thank you!!