Progressive Web App

Post on 21-Apr-2017

45 views 1 download

transcript

Progressive Web Apps

Vinci Rufus@areai51

Progressive Web Apps are user experiences that have the reach of the web, and are

Reliable | Fast | Engaging

HTTPS App ShellModel

Offline Support

In technical terms

60 fpsAdd to Home Screen

ProgressiveThe is the ‘Important’ Keyword

Web AppEnd of the day it’s a

HTTPS

Not so difficult nor expensive any more

Firebase

App Shell

Offline Support

Service Worker

Service worker (lifecycle events)

Install

Activated

Idle

Terminated

Fetch / Message

Error

Register

60fps

Add to Home Screen

Minimal Viable PWA• App Shell AppComponent (Root Component)

• Add to Home Screen Manifest.json• Full Screen Manifest.json• Offline Support Service Worker

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

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

Are you a PWA ?

• Lighthousehttps://developers.google.com/web/tools/lighthouse/

Tools to build PWA

SW Tool Box

http://bit.ly/prevent-default

SN Accelerators2016 Oct – XT

@nisheeddroid

Examples of PWA

https://github.com/hemanth/awesome-pwa#apps

..and that’s a wrap@areai51