Web Workers ermöglichen es, einen Skriptvorgang in einem Hintergrund-Thread auszuführen, der vom Hauptausführungsthread einer Webanwendung getrennt ist. Der Vorteil dabei ist, dass aufwändige Verarbeitungen in einem separaten Thread durchgeführt werden können, wodurch der Hauptthread (in der Regel die Benutzeroberfläche) ohne Blockierungen oder Verlangsamungen weiterlaufen kann.

Konzepte und Nutzung

Ein Worker ist ein Objekt, das mit einem Konstruktor (z. B.Worker()) erstellt wird und eine benannte JavaScript-Datei ausführt – diese Datei enthält den Code, der im Worker-Thread läuft.

Zusätzlich zu den Standardfunktionen vonJavaScript (wieString,Array,Object,JSON usw.) kann fast jeder Code, den Sie möchten, in einem Worker-Thread ausgeführt werden. Es gibt einige Ausnahmen: Beispielsweise kann man das DOM nicht direkt von einem Worker aus manipulieren oder einige Standardmethoden und -eigenschaften desWindow-Objekts verwenden. Informationen über den Code, den Sieausführen können, finden Sie unterunterstützte Funktionen undunterstützte Web-APIs.

Daten werden über ein Nachrichtensystem zwischen Workern und dem Hauptthread gesendet – beide Seiten senden ihre Nachrichten mit derpostMessage()-Methode und reagieren auf Nachrichten über denonmessage-Event-Handler (die Nachricht ist in derdata-Eigenschaft desmessage-Events enthalten). Die Daten werden dabei kopiert und nicht geteilt.

Arbeitsprozesse können wiederum neue Worker erzeugen, solange diese Worker innerhalb des gleichenUrsprungs wie die übergeordnete Seite gehostet werden.

Zusätzlich können Worker Netzwerkanfragen mit den APIsfetch() oderXMLHttpRequest machen (obwohl zu beachten ist, dass das AttributresponseXML vonXMLHttpRequest immernull sein wird).

Worker-Typen

Es gibt verschiedene Arten von Workern:

• Dedizierte Worker sind Worker, die von einem einzigen Skript genutzt werden. Dieser Kontext wird durch einDedicatedWorkerGlobalScope-Objekt dargestellt.
• Geteilte Worker sind Worker, die von mehreren Skripten verwendet werden können, die in verschiedenen Fenstern, IFrames usw. ausgeführt werden, solange sie sich im selben Domain wie der Worker befinden. Sie sind etwas komplexer als dedizierte Worker – Skripte müssen über einen aktiven Port kommunizieren.
• Service Worker fungieren im Wesentlichen als Proxy-Server, die zwischen Webanwendungen, dem Browser und dem Netzwerk (wenn verfügbar) sitzen. Sie sind unter anderem dazu gedacht, effektive Offline-Erfahrungen zu schaffen, Netzwerkanfragen abzufangen und basierend darauf, ob das Netzwerk verfügbar ist, angemessene Maßnahmen zu ergreifen und auf dem Server befindliche Ressourcen zu aktualisieren. Sie ermöglichen auch den Zugriff auf Push-Benachrichtigungen und Background-Sync-APIs.

Worker-Kontexte

WährendWindow für Worker nicht direkt verfügbar ist, sind viele der gleichen Methoden in einem geteilten Mix-In (WindowOrWorkerGlobalScope) definiert und durch ihre eigenen vonWorkerGlobalScope abgeleiteten Kontexte für Worker verfügbar gemacht:

• DedicatedWorkerGlobalScope für dedizierte Worker
• SharedWorkerGlobalScope für geteilte Worker
• ServiceWorkerGlobalScope fürService Worker

Schnittstellen

Worker

Stellt einen laufenden Worker-Thread dar, mit dem Sie Nachrichten an den laufenden Worker-Code senden können.

WorkerLocation

Definiert die absolute Position des von demWorker ausgeführten Skripts.

SharedWorker

Repräsentiert eine spezielle Art von Worker, die von mehrerenBrowsing-Kontexten (d.h. Fenstern, Tabs oder IFrames) oder sogar anderen Workern aus zugänglich ist.

WorkerGlobalScope

Stellt den generischen Umfang eines jeden Workers dar (erfüllt die gleiche Aufgabe wieWindow für normale Webinhalte). Verschiedene Arten von Workern haben Bereichsobjekte, die von dieser Schnittstelle erben und spezifischere Funktionen hinzufügen.

DedicatedWorkerGlobalScope

Repräsentiert den Bereich eines dedizierten Workers, der vonWorkerGlobalScope erbt und einige spezielle Funktionen hinzufügt.

SharedWorkerGlobalScope

Repräsentiert den Bereich eines geteilten Workers, der vonWorkerGlobalScope erbt und einige spezielle Funktionen hinzufügt.

WorkerNavigator

Repräsentiert die Identität und den Zustand des User Agents (des Clients).

Beispiele

Wir haben einige Demos erstellt, um die Nutzung von Web Workern zu zeigen:

• Einfaches Beispiel eines dedizierten Workers (dedizierten Worker ausführen).
• Einfaches Beispiel eines geteilten Workers (geteilten Worker ausführen).
• OffscreenCanvas Worker-Beispiel (OffscreenCanvas Worker ausführen).

Weitere Informationen darüber, wie diese Demos funktionieren, finden Sie unterVerwendung von Web Workern.

Spezifikationen

Siehe auch

• Verwendung von Web Workern
• Worker-Schnittstelle
• SharedWorker-Schnittstelle
• Service Worker API