Web Workers für parallele Nebenläufigkeit mit JavaScript
Auch wenn die JavaScript Engines der Browser immer schneller werden, gibt es bei der Entwicklung von Webanwendungen mit clientseitigem JavaScript gegenüber serverseitigen Techniken meist noch ein paar Nachteile, wie z.B. Browserkompatibilität oder fehlende Nebenläufigkeit. JavaScript an sich ist als Single-Threaded Umgebung ausgelegt und erlaubt so eigentlich keine gleichzeitige Ausführung von mehreren parallel abarbeitenden Skripten. Die Web Workers API, die beim W3C und der WHATWG als eigene Spezifikation (Working Draft) bereit steht, widmet sich dem Problem der parallenen Abarbeitung von Hintergrundaufgaben mit JavaScript, indem sie Threading ermöglicht. Für Webanwendungen bedeutet das eine leistungsstarke und reaktionsschnelle Benutzeroberfläche ohne lästige Dialogfelder zu nicht mehr reagierenden Skripten.
Web Worker sind laut W3C und WHATWG JavaScripts, die aus einer HTML-Website heraus aufgerufen werden und unabhängig im Hintergrund laufen. Zurzeit werden Web Worker in fast allen aktuellen Versionen der großen Browser, ausser dem Internet Explorer, unterstützt. In Version 10 soll auch der IE Web Worker tauglich sein. Obwohl Android-Browser in Version 2.1 Web Worker bereits verstanden, wurde der Support in neueren Versionen wieder aufgegeben.
In einem Tutorial bei Developerdrive wird mittels einem einfachen Beispiel anschaulich beschrieben, wie man die Web Worker API für parallel im Hintergrund ablaufende Aufgaben in HTML5 einbindet, um den Rest der Website von rechenintensiven Prozessen zu entlasten. Das Web Worker Skript bei Developerdrive erzeugt Zufallswörter und zeigt sie über einen Start- und Stopbutton unabhängig vom Rest der Website an. Im Tutorial wird zuerst das HTML5-Markup samt zwei JavaScript gesteuerten Buttons zum Starten und Stoppen des Workerskripts mit Browsersupport-Abfrage erstellt.
Danach wird das JavaScript für ein separates Web Worker Skript schrittweise erklärt. Im kleinen Beispiel bei Developerdrive erzeugt das Web Worker Skript ein Array mit Wörtern, die in zufälliger Reihenfolge in Schleife ausgegeben werden, sobald das Skript im Hintergrund über den HTML-Button gestartet wird.
Normalerweise werden Worker Skripts für aufwendigere und rechenintensivere Aufgaben, als die einfache Ausgabe von Wörtern eingesetzt. Z.B. das Vorladen und Zwischenspeichern großer Datenmengen, Bild-/Audio- /Videoanalyse, Motion Tracking sowie das Verarbeiten großer Arrays sind praktikablere Anwendungsfälle. Aber das Beispiel bei Developerdrive erklärt die grundlegende Funktionsweise und lässt sich beliebig erweitern – auch wenn man sich beim effektiven Einsatz von mehreren gleichzeitigen Web Workern für komplexe Aufgaben noch etwas intensiver mit Threading und Nebenläufigkeit befassen sollte.
Einzelheiten samt Schritt für Schritt Anleitung zum Nachbauen mit Quellcodebeispielen findet ihr im Tutorial bei Developerdrive.
Weiterführende Links:
Bildnachweis für die Newsübersicht: aka tambako / flickr.com, Lizenz: CC-BY
von Mario 03.07.2012 (08:18Uhr) 1.
Bitte beim Abschreiben den wichtigsten Punkt des Originalartikels nicht weglassen.
von Q 03.07.2012 (22:16Uhr) 2.
Macht das Teil großartig was anderes als window.setTimeout(function(){/*code*/},1)? So habe ich bisher das gelöst und es funktioniert mit jedem Browser. Nach einer Millisekunde wird der Code auch unabhängig vom restlichen JS-Ablauf ausgeführt.