Post on 07-Feb-2017
Professional Development
Knowledge: Progressive apps
BASICS
What are Progressive apps?
DEFINITIONWHAT CAN YOU DOHOW GOOGLE DEFINES A PROGRESSIVE APP
Definition• Progressive Apps are web
apps, they begin life in a tab. • When you go to a progressive
app enough, browsers prompt users to keep them.
• The app appears on your home screen as a shortcut.
• You can also add them right away using options in your browser.
WHAT ARE PROGRESSIVE APPS
Get prompted to add
WHAT ARE PROGRESSIVE APPS
What can you do
• Allow users to engage with your content without using an app store
• Meet the user where they are (on your site)
• Allow the user to access your content through their phone’s app icons
• Update your content as you normally do for the web
WHAT ARE PROGRESSIVE APPS
How Google defines a progressive app
• Responsive
WHAT ARE PROGRESSIVE APPS
How Google defines a progressive app
• Responsive• App-like
WHAT ARE PROGRESSIVE APPS
How Google defines a progressive app
• Responsive• App-like • Fresh (Service Worker updates)
WHAT ARE PROGRESSIVE APPS
How Google defines a progressive app
• Responsive• App-like • Fresh (Service Worker updates)
• Safe
WHAT ARE PROGRESSIVE APPS
What are Progressive apps?
ADD ONE YOURSELFAPPLICATION
Application
WHAT ARE PROGRESSIVE APPS
https://airhorner.com/ https://voice-memos.appspot.com/
www.flipkart.com
Add one yourself (a shortcut)
WHAT ARE PROGRESSIVE APPS
Add one yourself (a shortcut)
WHAT ARE PROGRESSIVE APPS
Resources
Resources
• Some basic information: https://support.google.com/fusiontables/answer/2571232?hl=en
• Deeper information: https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/
• A more technical dive from Google: https://developers.google.com/web/progressive-web-apps?hl=en
RESOURCES
Browser support• Progressive apps use Service Workers to implement offline
capabilities for the app• Service Workers are currently only supported on Chrome and Opera
.• Service Workers are a new browser feature that provide event-
driven scripts that run independently of web pages.• Defined: A Service Worker is a script that runs in the background
and can intercept network requests and return a cached response. • Service Workers also support Push Notifications.• Resource: Instant
Loading Web Apps With An Application Shell Architecture.
RESOURCES
How Google defines a progressive app
• Progressive - Work for every user, regardless of browser choice because they’re built with progressive enhancement as a core tenet.
• Responsive - Fit any form factor: desktop, mobile, tablet, or whatever is next.• Connectivity independent - Enhanced with service workers to work offline or on low quality
networks.• App-like - Feel like an app to the user with app-style interactions and navigation because it's
built on the app shell model.• Fresh - Always up-to-date thanks to the service worker update process.• Safe - Served via HTTPS to prevent snooping and ensure content hasn’t been tampered with.• Discoverable - Are identifiable as “applications” thanks to W3C manifests and service worker
registration scope allowing search engines to find them.• Re-engageable - Make re-engagement easy through features like push notifications.• Installable - Allow users to “keep” apps they find most useful on their home screen without the
hassle of an app store.• Linkable - Easily share via URL and not require complex installation.
RESOURCES