• JavaScript im Hintergrund ausführen - Web Worker

    Workers, genauer noch Web Workers heißen sie und sind eine neue Technologie in Sachen JavaScript. Eine Implementierung seitens IE ist noch nicht vorhanden, ist aber früher oder später zu erwarten. Der Firefox beherrscht sie ab Version 3.5, der Seamonkey ab Version 2. Doch was ist ein Worker und wie funktioniert er?

    Der Worker an sich ist eine JavaScript-Klasse. Der Constructor lädt eine JavaScript-Datei im Hintergrund, wie folgt:

    1
    
    var myWorker = new Worker('src/javascript-file.js');

    Das tolle am Worker ist, dass er einfach im Hintergrund geladen werden kann und dort dann ausgeführt wird. Der Sinn eines Workers besteht also darin Hintergrundaktionen zu verarbeiten. Der effektive Sinn bzw. das Ziel von Workern ist aber eine bessere Strukturierung von Code. Während der Worker bspw. Berechnungen durchführt oder andere Algorithmen laufen lässt, bearbeiten die ganz normal implementierten JavaScript-Dateien bspw. den DOM oder Werten Rückgaben des Workers aus.

    Wichtig zu wissen: Komplexe mathematische Berechnungen blockieren nicht mehr die Website wenn Sie als Worker ausgeführt werden.

    Zum Verständnis des Prinzips habe ich ein kleines Schema erstellt:
    JavaScript Worker Schema



    Das heißt, das “Standard-JavaScript” und die Worker kommunizieren untereinander - und zwar mit einer ganz bestimmten Schnittstelle.
    Mit onmessage definieren wir die Funktion die aufgerufen wird, wenn der Worker mit uns reden will, der Worker also etwas sendet.

    1
    2
    3
    4
    
    var myWorker = new Worker('src/javascript-file.js');
    myWorker.onmessage = function(event){
      alert('Worker meldet: '+event.data);
    }

    Doch wie reden wir mit dem Worker? Schließlich wollen wir ihm Aufgaben geben. Das geschieht noch einfacher als das Empfangen:

    1
    
    myWorker.postMessage('Rede mit mir!');

    Ok, nun kommunizieren wir mit dem Worker. Doch woher weiß der Worker selbst, dass wir mit ihm reden? Die onmessage-Funktion gibt es hierzu zweimal. Einmal im eigentlichen Script (siehe oben) um Daten zu empfangen. Desweiteren aber natürlich auch im Worker (javascript-file.js) selbst:

    1
    2
    3
    4
    5
    
    onmessage = function(event){
      if(event.data == 'Rede mit mir!'){
        postMessage('Hier bin ich, der Worker persönlich!');
      }
    }

    Natürlich kann der Worker auch Fehlerbehandlung. Ich persönlich wollte euch das Thema kurz und bündig näher bringen, für mehr Informationen dienen die Links unten. Der Worker ist an sich eine tolle neue Implementierung in JavaScript, funktioniert aber bisher nur in Firefox, Safari und ähnlichen neuen/modernen Browsern (Webkit, Gecko).

    Für mehr Informationen über den Worker und seine Möglichkeiten einfach mal folgende Quellen anklicken:
    https://developer.mozilla.org/En/Using_web_workers
    http://ejohn.org/blog/web-workers/
    http://www.phphatesme.com/blog/webentwicklung/arbeitstier-browser-web-workers/


Eine Antwort hinterlassen