Upgrade to Pro — share decks privately, control downloads, hide ads and more …

PWA Updates in Chrome 68

Jimmy Moon
September 16, 2018

PWA Updates in Chrome 68

Let's dive into new behavior for A2HS(Add to Home Screen). You can also get understand of making PWA as an app for Desktop installable and powerful

Jimmy Moon

September 16, 2018
Tweet

More Decks by Jimmy Moon

Other Decks in Programming

Transcript

  1. Today ... - Add to Home Screen(A2HS) Changes - PWA

    Desktop Hand-on - Service Worker Caching Changes
  2. Chrome < 68 - Banner notification - Meets the add

    to home screen criteria 
 => SHOW - Not call preventDefault() on the beforeinstallprompt event
 => SHOW - Calling prompt() on the beforeinstallprompt event
 => SHOW
  3. Chrome >= 68 - Mini-inforbar - It will always be

    displayed as meets the `add to home screen criteria` 
 => SHOW - If dismissed by a user, will not be shown for a period of time (~3 month)
 => HIDE
  4. Chrome >= 68 - A2HS Dialog - Calling prompt() within

    a user gesture 
 => SHOW - User tabs the mini-inforbar
 => SHOW - Clicks 'Add to Home screen' from the Chrome menu
 => SHOW
  5. - The web app is not installed - User engagement

    heuristic (for at least 30 seconds) - Web app manifest - short_name or name - icons (192px and a 512px) - start_url - display (fullscreen, standalone, or minimal-ui) - HTTPS with service workers Criteria
  6. updateViaCache('none' | 'all' | 'imports') none all imports sw.js HTTP

    cache ignored Looking at Cache HTTP cache ignored imports scripts HTTP cache ignored Looking at Cache Looking at Cache
  7. - New in Chrome 68 | Web | Google Developers

    - Changes to Add to Home Screen Behavior | Web | Google Developers - Add to Home Screen | Web Fundamentals | Google Developers - https://pwa.cafe/ - Fresher service workers, by default | Web | Google Developers References