PWA Roadshow

The Progressive Web App Roadshow is a series of events that explains the what, why and how of PWAs and allows participants to work through some code labs that provides hands-on experience.

Name

Progressive Web App Roadshow San Francisco 2017

Location

Google Launchpad Space – 301 Howard Street San Francisco, CA – 4th Floor

Date

Sunday, October 22nd – 9:00 AM to 5:00 PM

Role

Participant – I participated this event as part of the Chrome Dev Summit. Registration was super limited so I’m glad I was able to attend.

About

The Progressive Web App Roadshow is a series of events that explains the what, why and how of PWAs and allows participants to work through some code labs that provides hands-on experience.

What are PWAs?

Progressive Web Apps are experiences that combine the best of the web and the best of apps. They load quickly, even on flaky networks, can re-engage with users by sending web push notifications, have an icon on the home screen and load as top-level, full screen experiences.

Topics Covered

Overview

Integration

Reliability

Engaging

  • Web Push Notifications Library
  • Web Push Notifications
    • Carnival
  • Good Notifications
    • Timely
      • Matters right now
    • Relevant
      • User cares about it
    • Precise
      • Exact details
  • How Push Works
    • Client Side
      • Get permissions to send notifications
      • Subscribe & get PushSubscription
      • Send PushSubscription to server
    • Server Side
      • Create message on server
      • Use Web Push Protocol to send
        • All browsers use Web Push API
      • Push Service delivers message
      • Message arrives on device
      • Browser wakes up service worker
      • Handle push event and shows notification
    • Application security keys
      • public
        • used for subscription
      • private
        • used to send messages
    • Subscribing and unsubscribing
      • Is web push supported?
      • Check subscription status
      • Subscribe to user
        • userVisibleOnly
      • Promoting and permission
        • First ask, then prompt
        • Weather.com
          • gives options

Security

  • HTTPS
    • identity
    • confidentiality
    • integrity
  • Man in the middle attacks
  • First get HTTPS then extend to HTTP/2
  • Certificate
  • Referrer Policy

Lighthouse

  • Available in Chrome DevTools & as a command line tool.
  • Aim for 90 and above on all metrics
    • PWA
    • Performance
    • Accessibility
    • Best Practices

Codelabs

Photos

And I’m pumped!

 

3 views
Last updated on May 14th, 2020