progressive web apps - bringing the web front and center

Post on 22-Jan-2018

702 Views

Category:

Education

0 Downloads

Preview:

Click to see full reader

TRANSCRIPT

https://demo.vaadin.com/expense-manager

a.k.a. “PWA”

Lots of events, tools, ideas and great documentation –and a few misconceptions

Progressive Web App

GameGalleryBook

NewspaperArt ProjectTool

Web App

Progressive Web Site

Progressive Web Site++

Progressive Web Site++

“Web as native”

“Web as native”

“Web as native”

“Web as native”

“Web as native”

“Web as native”

“Web as native”

“Web as native”

“Web as native”

“Web as native”

“Web as native”

PWA is

PWA is

PWA is

PWA is

PWA is

PWA is

PWA is

PWA is

PWA is

PWA is

PWA is

PWA is

Discoverable Installable LinkableSafe

needs to be served from a secure origin

needs to have an app manifest

Responsive App-LikeProgressive

PWA is

Progressive Enhancement

Progressive Enhancement

Progressive Enhancement

Progressive Enhancement

can use your productno matter what

do what they came for

change their device

where they are

PWA is

NetworkIndependent

Re-engageable

Fresh

Act as proxy servers that sit

between web apps, the browser,

and the network.

Define the rules what should be

cached and loaded from where –

no more hoping the browser

caches your work.

Intercept network requests and

define what happens. Serve from

cache, refresh, convert before

display, etc….

Refresh your app in the

background, pull new content

and notify the user with push

notifications that something new

is available.

Detect support easily. If your

user’s device doesn’t support it,

fall back to push service.

PWA is

Discoverable Installable LinkableSafe

discover

“try before you buy”

Updates happen in the background

store experience?

just another resource

index and ingest

Store & Bing

Active Submission

Active Submission

Passive Ingestion

a PWA will just be an app

Available Now

Available Now

Coming soon

• Service Worker

• Cache API

• Push API

Standalone Window

Independent from browser process Less overhead

Isolated cache

Nearly unlimited storage (indexed DB, localStorage, etc.)

Offline & background processes

Access to Windows Runtime (WinRT) APIs via JavaScript Calendar

Cortana

Address Book

helps the web

new users will enjoy your products

App core

iPhone iPad

Android Phone

Android Tablet

Windows

MacOS

Web

Submit to App Store

Submit to Play Store

Submit to Windows Store

Submit to Mac App Store

Host

App core

iPhone iPad

Android Phone

Android Tablet

Windows

MacOS

Web

Submit to App Store

Submit to Play Store

Submit to Windows Store

Submit to Mac App Store

Host

App core

Web

iPhone iPad

Android Phone

Android Tablet

Windows

MacOS

Other PWA-capable

Host

Free

brings the best of the web

top related