1.
Progressive Web Apps
Vinci Rufus
@areai51

2.
Progressive Web Apps are user experiences that
have the reach of the web, and are
Reliable | Fast | Engaging

3.
HTTPS
App Shell
Model
Offline
Support
In technical terms
60 fps
Add to
Home
Screen

4.
Progressive
The is the ‘Important’ Keyword

5.
Web App
End of the day it’s a

6.
HTTPS
Not so difficult nor expensive any more
Firebase

7.
App Shell

8.
Offline Support

9.
Service Worker

10.
Service worker (lifecycle events)
Install
Activated
Idle
Terminated
Fetch / Message
Error
Register

11.
60fps

12.
Add to Home Screen

13.
Minimal Viable PWA
• App Shell  AppComponent (Root Component)
• Add to Home Screen  Manifest.json
• Full Screen  Manifest.json
• Offline Support  Service Worker

14.
Full-on PWA
• Push Notifications  GCM | FCM |Push API
• Deeply Integrated PWA  WebAPK
• SSR for app Shell  Universal Rendering
• Offline Transactions  Background Sync

15.
Selling PWAs (.. to Your boss, client, PM..)
• It’s a replacement for your Responsive / Adaptive Web App
• Not every Native App needs to be Native.
• Chrome users on desktop & mobile get super enhanced experience.
• Offline support is not everything.
• There is nothing to lose, Everything to Gain

16.
Are you a PWA ?
• Lighthouse
https://developers.google.com/
web/tools/lighthouse/

17.
Tools to build PWA
SW Tool Box

18.
http://bit.ly/prevent-default

19.
SN Accelerators
2016 Oct – XT
@nisheeddroid

20.
Examples of PWA
https://github.com/hemanth/awesome-pwa#apps

21.
..and that’s a wrap
@areai51