Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Dimitri Gielis
Service Workers &
APEX
www.apexRnD.be
dgielis.blogspot.com
@dgielis
dgielis@apexRnD.be
Dimitri Gielis
❖ Founder & CEO of APEX R&D
❖ 18+ years of Oracle Experience (OCP & APEX Certified)
❖ Oracle ACE Director
❖...
https://www.apexofficeprint.com
Workshop - tomorrow 4.15 pm (Jazz 1)
http://dgielis.blogspot.com @dgielis
Rich offline experience
Periodic background syncs
Push notifications
Geofencing
Agenda
❖ What are Service Workers
❖ What do they solve
❖ Service Worker Life Cycle
❖ Example of a Service Worker
❖ Use cas...
Service Workers
A service worker is a script that stands between
your website and the network
A service worker is a script that is run by your
browser in the background, separate from a web
page, opening the door to ...
Rich offline experience
Periodic background syncs
Push notifications
Geofencing
What is a Service Worker
❖ It's a JavaScript Worker, so it can't access the DOM directly
❖ Service worker is a programmabl...
JavaScript Promises
❖ JavaScript is single threaded
❖ We want multithreaded
❖ Async success/failure
http://www.html5rocks....
JavaScript Promises
http://www.html5rocks.com/en/tutorials/es6/promises/
Service Workers solve
❖ Offline usage (Offline-first)
❖ Programmable cache control
❖ Custom response

❖ Background process...
Service Worker Life Cycle
Register
Using Service Worker
http://www.html5rocks.com/en/tutorials/service-worker/introduction/
Register a Service Worker
Register
Install a Service Worker
Register
Fetch a Service Worker
Register
Update & Activate a Service Worker
Register
Viewing/Debug a Service Worker
(old: chrome://serviceworker-internals/)chrome://inspect/#service-workers
Demo SW in APEX
Lessons learned
❖ JavaScript knowledge important (Promise)
❖ Get sample working locally first
❖ Replicate in Oracle APEX
❖...
Browser Support?
Browser Support
http://caniuse.com/#feat=serviceworkers
Browser Support
https://jakearchibald.github.io/isserviceworkerready/
References
❖ https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API
❖ http://www.html5rocks.com/en/tutorials/...
Recap
❖ What are Service Workers
❖ What do they solve
❖ Service Worker Life Cycle
❖ Example of a Service Worker
❖ Use case...
Q&A
www.apexRnD.be
dgielis.blogspot.com
@dgielis
dgielis@apexRnD.be
❖ Looking for consulting, training and development in Oracle
Application Express (APEX)?
❖ Contact : www.apexRnD.be
❖ Mail...
Service Workers and APEX
Upcoming SlideShare
Loading in …5
×

Service Workers and APEX

1,377 views

Published on

Service Workers bring offline and push notifications closer to Oracle Application Express (APEX).

Published in: Technology
  • Be the first to comment

Service Workers and APEX

  1. 1. Dimitri Gielis Service Workers & APEX www.apexRnD.be dgielis.blogspot.com @dgielis dgielis@apexRnD.be
  2. 2. Dimitri Gielis ❖ Founder & CEO of APEX R&D ❖ 18+ years of Oracle Experience (OCP & APEX Certified) ❖ Oracle ACE Director ❖ “APEX Developer of the year 2009” by Oracle Magazine ❖ “Oracle Developer Choice award (ORDS)” in 2015 ❖ Author Expert Oracle Application Express ❖ Presenter at Oracle Conferences (OOW, ODTUG, OGh, UKOUG, …)
  3. 3. https://www.apexofficeprint.com Workshop - tomorrow 4.15 pm (Jazz 1)
  4. 4. http://dgielis.blogspot.com @dgielis
  5. 5. Rich offline experience Periodic background syncs Push notifications Geofencing
  6. 6. Agenda ❖ What are Service Workers ❖ What do they solve ❖ Service Worker Life Cycle ❖ Example of a Service Worker ❖ Use cases in APEX
  7. 7. Service Workers
  8. 8. A service worker is a script that stands between your website and the network
  9. 9. A service worker is a script that is run by your browser in the background, separate from a web page, opening the door to features which don't need a web page or user interaction. http://www.html5rocks.com/en/tutorials/service-worker/introduction/
  10. 10. Rich offline experience Periodic background syncs Push notifications Geofencing
  11. 11. What is a Service Worker ❖ It's a JavaScript Worker, so it can't access the DOM directly ❖ Service worker is a programmable network proxy, allowing you to control how network requests from your page are handled. ❖ It will be terminated when not in use, and restarted when it's next needed ❖ Service Workers have access to the IndexedDB API ❖ Service workers are asynchronous and make extensive use of promises ❖ Service workers require content to be served via https
  12. 12. JavaScript Promises ❖ JavaScript is single threaded ❖ We want multithreaded ❖ Async success/failure http://www.html5rocks.com/en/tutorials/es6/promises/
  13. 13. JavaScript Promises http://www.html5rocks.com/en/tutorials/es6/promises/
  14. 14. Service Workers solve ❖ Offline usage (Offline-first) ❖ Programmable cache control ❖ Custom response
 ❖ Background processing ❖ Push notifications ❖ BackgroundSync ❖ Alarms (Task Scheduler)
  15. 15. Service Worker Life Cycle
  16. 16. Register
  17. 17. Using Service Worker http://www.html5rocks.com/en/tutorials/service-worker/introduction/
  18. 18. Register a Service Worker
  19. 19. Register
  20. 20. Install a Service Worker
  21. 21. Register
  22. 22. Fetch a Service Worker
  23. 23. Register
  24. 24. Update & Activate a Service Worker
  25. 25. Register
  26. 26. Viewing/Debug a Service Worker (old: chrome://serviceworker-internals/)chrome://inspect/#service-workers
  27. 27. Demo SW in APEX
  28. 28. Lessons learned ❖ JavaScript knowledge important (Promise) ❖ Get sample working locally first ❖ Replicate in Oracle APEX ❖ Unregister SW and close tab ❖ Use Chrome Dev Tools to debug
  29. 29. Browser Support?
  30. 30. Browser Support http://caniuse.com/#feat=serviceworkers
  31. 31. Browser Support https://jakearchibald.github.io/isserviceworkerready/
  32. 32. References ❖ https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API ❖ http://www.html5rocks.com/en/tutorials/service-worker/introduction/ ❖ https://www.talater.com/upup/?utm_source=the-webdesigner.co&utm_medium=newsletter ❖ https://www.smashingmagazine.com/2016/02/making-a-service-worker/ ❖ https://css-tricks.com/serviceworker-for-offline/ ❖ https://developers.google.com/web/fundamentals/getting-started/ ❖ https://aarontgrogg.com/blog/2015/07/20/the-difference-between-service-workers-web- workers-and-websockets/ ❖ https://jakearchibald.github.io/isserviceworkerready/
  33. 33. Recap ❖ What are Service Workers ❖ What do they solve ❖ Service Worker Life Cycle ❖ Example of a Service Worker ❖ Use cases in APEX
  34. 34. Q&A www.apexRnD.be dgielis.blogspot.com @dgielis dgielis@apexRnD.be
  35. 35. ❖ Looking for consulting, training and development in Oracle Application Express (APEX)? ❖ Contact : www.apexRnD.be ❖ Mail : info@apexRnD.be Consulting, Development, Training

×