Ein Web Worker ist eine JavaScript-API, die es erlaubt, Skripte in einem separaten Hintergrund-Thread des Browsers auszuführen, ohne die Benutzeroberfläche zu blockieren.
Was bedeutet das?
JavaScript läuft im Browser normalerweise in einem einzigen Thread, dem sogenannten Main Thread. Alle Aufgaben, von der DOM-Manipulation über Animationen bis hin zu rechenintensiven Berechnungen, teilen sich diesen einen Ausführungskanal. Führt ein Skript eine aufwendige Operation durch, friert die Benutzeroberfläche ein, bis die Berechnung abgeschlossen ist. Dieses Phänomen bezeichnet man als „Blocking“: Die Seite reagiert nicht, bis der Thread wieder frei ist.
Web Workers umgehen dieses Problem, indem sie JavaScript-Code in einem separaten Worker-Thread starten. Der Worker hat keinen direkten Zugriff auf das DOM, da DOM-Operationen ausschließlich im Main Thread erlaubt sind. Dafür kann er rechenintensive Aufgaben übernehmen, z. B. das Parsen großer JSON-Datensätze, kryptografische Berechnungen oder Bildverarbeitung. Die Kommunikation zwischen Main Thread und Worker erfolgt über ein Nachrichtensystem mit postMessage() und dem onmessage-Ereignis.
Es gibt drei Typen: Dedicated Workers (exklusiv für ein Skript), Shared Workers (mehrere Skripte teilen einen Worker) und Service Workers (eine spezielle Variante für Caching und Offline-Funktionalität, die auch als Grundlage für Push-Benachrichtigungen dient). Service Workers spielen bei Progressive Web Apps (PWA) eine zentrale Rolle und werden auch für WordPress-PWA-Plugins genutzt, um Seiten offline verfügbar zu machen.
Beispiel aus der Praxis
Der Gutenberg-Block-Editor in WordPress nutzt intern Web Workers, um das Parsen und Serialisieren von Block-Grammatiken aus dem Main Thread auszulagern. Beim Öffnen eines langen Beitrags mit vielen Blöcken kann der Editor so weiterarbeiten, während der Worker im Hintergrund die Block-Struktur verarbeitet. Für Website-Betreiber ist das Ergebnis direkt spürbar: Der Editor reagiert flüssiger, auch bei umfangreichen Seiten mit komplexen Layouts.
Tipp aus der Praxis
Wenn Sie eigene JavaScript-Anpassungen für Ihre WordPress-Website entwickeln oder entwickeln lassen, ziehen Sie Web Workers für alles in Betracht, was länger als einige Millisekunden dauert: Suche in lokalen Datensätzen, Formatkonvertierungen oder statistische Berechnungen im Browser. Prüfen Sie die Unterstützung vorab mit if (window.Worker) { ... }. Alle modernen Browser unterstützen Dedicated Workers zuverlässig; für ältere Umgebungen empfiehlt sich ein Fallback auf synchrone Verarbeitung mit sichtbarem Lade-Indikator.