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

ゼロから始めるっぽい Service Worker

ゼロから始めるっぽい Service Worker

Yutaro Miyazaki

November 18, 2017
Tweet

More Decks by Yutaro Miyazaki

Other Decks in Programming

Transcript

  1. Yutaro Miyazaki (@vwxyutarooo) Yutaro Miyazaki (@vwxyutarooo) ニート ↓ フリーの Web

    屋 ↓ アプリ屋のフロントエンド ❤ Vue.js, TypeScript
  2. SW

  3. Register Register 同一オリジンにあるスクリプト Content‑Type が JavaScript であること Secure Context https://

    , localhost , files:// 改変された SW が登録されてしまうケースを防ぐ
  4. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting()
  5. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting() ①
  6. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting() ②
  7. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting() ③
  8. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting()
  9. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting()
  10. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting() ⑤
  11. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting() ⑥
  12. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting() ⑦
  13. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting() ⑦
  14. SW Register (oninstall) Installed Waiting Redundant (onactivate) Activated Controller Update

    Installing Activating 2nd Access clients.claim() Close apps skipWaiting()
  15. Links Links Demo: vwxyutarooo/service‑worker‑demo | GitHub GoogleChrome/samples/service‑worker | GitHub delapuente/service‑workers‑101

    | GitHub ServiceWorker | MDN The Service Worker Lifecycle | Google Developers Live Data in the Service Worker | Google Developers