Talk to be presented at SingaporeJS meetup on 17th Nov 2015 regarding the latest advances and popular use cases of service workers in JavaScript.

1. What’s happening with
Service Workers?

2. Let’s start with a survey

3. Q1: How many of you are aware of more
than one feature of
“Service Workers”?

4. Q2: How many of you are using
Service Workers?

5. Q3: How are you using Service Workers?

6. Let’s start!

7. What is a Service Worker?

8. Scriptable
Request Interceptor / Network
Proxy

9. Prefetch resources

10. Syncing data
When online after being offline

11. Offline capabilities
Cache maintenance
Demo

12. Fallback response
e.g. 404 request for an image

13. Mock response

14. Communication between renderer and
Service worker possible via
PostMessage API

15. Timeout requests.
Don’t have SPOFs. Enforce latency SLA on third party requests.

16. Offline Analytics caching
Demo

17. Request JSON and render HTML
via cached templates
Drastically reduces the data sent to client on every page refresh.

18. Don’t invalidate complete
resource
Get and use the diff of the updated resource.
**based on HTTP archive data, after 30 days the CSS data is 97% similar

19. Images and Service Workers

20. Dynamic image format
Rewrite image url based upon the client headers for supported
image formats

21. Image spritesheet
Don’t rely on CSS background-image for using Image sprites

23. Cached header for JPEGs
Based on Facebook Engineering’s image optimization post

24. Push Notifications
Demo: PushCrew

25. Security

26. CSP in use with Service Workers

28. Resources:
● W3C spec
● Service Worker specification
● Service Worker Demos
● Is Service Worker ready?
Slides:
● There’s a proxy in your browser - Ilya Grigorik

29. Thanks. Questions?
+ApoorvSaxena
@apoorv_saxena