PracticalServiceWorkers.md

PracticalServiceWorkers.md

Practical Service Workers

• Web worker

  • Why do we have web workers?
  • because of the way javascript works
    • (event -> work -> paint)
  • If something in the work part of the loop hangs, the event loop breaks.
  • Web Workers run in a separate thread
    • Doesn't block painting

• Service Workers

  • Webpage -> service worker -> Internet
    • Event based proxy
  • Async
  • HTTPS Only
  • No access to localStorage
  • Event based

• Lifecyle and events

  • install
    • this.oninstall = () => {}
  • activate
    • this.onactivate = () => {}
  • fetch
    • this.onfetch = () => {}
  • message
    • this.onmessage = () => {} (2 more)

Building offline applications

• Fetch
  • Returns a promise
• Cache
  • cache.put(request, response);
  • CacheStorage.open('key').then(cache => { cache.put(...) });
  • cache.add(url)

Reading Web push notifications at scale

psw.md

Practical Service Workers

• Web worker

  • Why do we have web workers?
  • because of the way javascript works
    • (event -> work -> paint)
  • If something in the work part of the loop hangs, the event loop breaks.
  • Web Workers run in a separate thread
    • Doesn't block painting

• Service Workers

  • Webpage -> service worker -> Internet
    • Event based proxy
  • Async
  • HTTPS Only
  • No access to localStorage
  • Event based

• Lifecyle and events

  • install
    • this.oninstall = () => {}
  • activate
    • this.onactivate = () => {}
  • fetch
    • this.onfetch = () => {}
  • message
    • this.onmessage = () => {} (2 more)

Building offline applications

• Fetch
  • Returns a promise
• Cache
  • cache.put(request, response);
  • CacheStorage.open('key').then(cache => { cache.put(...) });
  • cache.add(url)

Reading Web push notifications at scale