Web Workers - Das Arbeitstier Browser

2,580 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
2,580
On SlideShare
0
From Embeds
0
Number of Embeds
233
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Web Workers - Das Arbeitstier Browser

  1. 1. Sebastian Bauer | Nero D&S GmbH Web Workers „Das Arbeitstier Browser“
  2. 2. Wer spricht? • Sebastian Bauer • Team Leader Intranet Services Team • Webentwickler aus Leidenschaft • „Web/Mobile addicted“ • @litervollmilch • http://xing.com/profile/Sebastian_Bauer22 • http://www.itkrauts.com
  3. 3. Über die Nero D&S GmbH • Entwickler für Liquid Media Technologien • Tochter der Nero AG • 1995 gegründet • Hauptsitz: Karlsbad, Deutschland • Regionale Niederlassungen: • Karlsbad, Deutschland • Glendale, Kalifornien, USA • Yokohama, Japan • Ca. 500 Mitarbeiter weltweit • Über 300 Millionen Installationen • Job gesucht?? ;-)
  4. 4. WEB WORKERS? WTF?
  5. 5. Ein Überblick über Web Workers • W3C Working Draft • HTML5 • JavaScript API für Arbeitsprozesse im Hintergrund • Parallelisierung ohne UI Blocking • Kein echtes Multi-Threading! • Dedicated Workers / Shared Workers
  6. 6. UND WOFÜR SO?
  7. 7. Legen wir los! WEB WORKERS IM EINSATZ
  8. 8. Einfaches Beispiel • Simulierte, 5 Sekunden lange „Berechnung“
  9. 9. The Web Worker‘s Way - Dedicated Worker
  10. 10. Dedicated Worker – bsp1_worker.js
  11. 11. „Liebe ist die einzige Sache, die sich vermehrt, wenn man sie teilt.“ Autor unbekannt
  12. 12. Einen Schritt weiter.. SHARED WORKERS
  13. 13. Ein Worker, Sie alle zu knechten.. • Ein Worker für mehrere Seiten • Verbindung über „Ports“ • „Stirbt“ wenn alle Seiten geschlossen • Posten von Nachrichten an alle „Ports“ möglich
  14. 14. Beispiel Shared Worker
  15. 15. Shared Worker – bsp2_sharedworker.js
  16. 16. Shared Worker – bsp2_sharedworker.js
  17. 17. Was geht nicht? EINSCHRÄNKUNGEN
  18. 18. Kein Zugriff auf den DOM! • alert() • document.getElementById() •…
  19. 19. Kein Zugriff auf Elternseite! • window Objekt • Objekte aus globalem Scope
  20. 20. Geht’s noch? WAS GEHT DENN ÜBERHAUPT?
  21. 21. Zugriff auf… • navigator • location (nur lesend!) • XMLHttpRequest • Object, Array, Date, Math, String • setTimeout(), setInterval() • importScripts() (innerhalb der gleichen Domain) • ApplicationCache API
  22. 22. Übertragen von Daten via postMessage() • Strings • Arrays • JSON Objekte •…
  23. 23. Und natürlich… „Spawnen“ weiterer Worker
  24. 24. Best Practices • Worker spezialisieren! • Keine riesigen Objekte hin- und herschieben! • addEventListener() benutzen • Keine „Trivialarbeiten“
  25. 25. WEITERE EINSATZGEBIETE / INTERESSANTE DEMOS
  26. 26. Motion Tracking with Web Workers http://bit.ly/ww_motio
  27. 27. „Simulated Annealing“ http://bit.ly/ww_annealing
  28. 28. Außerdem interessant für.. • Spiele-Engines • Desktop Anwendungen (AIR?) • Berechnungen von Graphen (Canvas) • …euer Projekt? Ideen?
  29. 29. Zu guter Letzt… KOMPATIBILITÄT?
  30. 30. Web Workers – WTF? WEB WORKERS FTW!
  31. 31. Bildernachweis • -nw- @flickr: http://www.flickr.com/photos/-nw-/4900267921/ • Éole @flickr: http://www.flickr.com/photos/eole/73301169/ • Saschaaa @ flickr: http://www.flickr.com/photos/saschaaa/152502539/ • Stefan Baudy @flick: http://www.flickr.com/photos/-bast-/349497988/ • RavenFire @flickr: http://www.flickr.com/photos/escapethematrix/525800552/ • Ka Lodger @flickr: http://www.flickr.com/photos/kaeau/31336163/ • Chris-Håvard Berge @flickr: http://www.flickr.com/photos/chberge/4113323306/ • Tara Hunt @flickr: http://www.flickr.com/photos/missrogue/199208087/

×