Was sind die Anwendungsfälle für Web Worker? [geschlossen]

174

Ich suche nach realen Szenarien für die Verwendung der Web Workers API .

javascript html web-worker

— Sergey Ilinsky
quelle

Werden sie von Mobil- / Webkit-Plattformen unterstützt?

— dmp

Ich weiß es nicht genau, würde es aber vermuten.

— Sergey Ilinsky

@danp Browser-Unterstützung: caniuse.com/webworkers

— Dheeraj Vepakomma

Ich habe einen Fall geschrieben, in dem wir zuerst einen Web-Worker eingesetzt haben und dann festgestellt haben, dass wir ohne ihn besser dran sind - windward.net/blogs/web-workers-abandon/#.Vl3QdXarQ-U

— David Thielen

Antworten:

143

John Resig (von jQuery) hat eine Reihe interessanter Beispiele für die Verwendung von Web-Workern - Spiele, Grafiken, Krypto.
Eine andere Verwendung ist Web I / O - mit anderen Worten, das Abrufen von URLs im Hintergrund. Auf diese Weise blockieren Sie nicht die Benutzeroberfläche, die auf Abfrageergebnisse wartet.
Eine weitere praktische Anwendung: In Bespin verwenden sie Web Worker, um die Syntax hervorzuheben. Sie möchten die Codebearbeitung nicht blockieren, während Sie die App verwenden.
Von Mozilla : Eine Möglichkeit für Mitarbeiter besteht darin, Ihrem Code zu erlauben, prozessorintensive Berechnungen durchzuführen, ohne den Thread der Benutzeroberfläche zu blockieren.

Stellen Sie sich als praktisches Beispiel eine App mit einer großen Tabelle mit #s vor (dies ist eine reale Welt, übrigens - entnommen aus einer App, die ich vor ca. 2 Jahren programmiert habe). Sie können ein # in einer Tabelle über ein Eingabefeld ändern, und eine Reihe anderer Zahlen in verschiedenen Spalten werden in einem ziemlich intensiven Prozess neu berechnet.

Der alte Workflow war: Ändern Sie die #. Holen Sie sich Kaffee, während JavaScript durch Änderungen an anderen Zahlen knirscht und die Webseite 3 Minuten lang nicht reagiert - nachdem ich sie für die Hölle und zurück optimiert habe. Komm zurück mit Kaffee. Ändern Sie eine zweite #. Wiederholen Sie viele Male. Klicken Sie auf die Schaltfläche SPEICHERN.

Der neue Workflow mit den Arbeitern könnte sein: Ändern Sie die #. Erhalten Sie eine Statusmeldung, dass etwas neu berechnet wird, Sie können jedoch andere # ändern. Ändern Sie weitere #s. Wenn Sie mit dem Ändern fertig sind, warten Sie, bis sich der Status auf "Alle Berechnungen sind abgeschlossen, Sie können jetzt die endgültigen #s überprüfen und speichern" ändert.

— DVK
quelle

Tolle Links! Ich hatte noch nie von Arbeitern gehört ... mmm, Arbeiter. (Zeit für eine lange, heiße Dusche ...)

— Peter Rowell

Ich weiß, dass dies eine zwei Jahre alte Antwort ist, aber ich wollte nur erwähnen, dass Sie für Artikel 2 (Abruf-URLs) keine Web Worker benötigen sollten. XHR erfolgt asynchron und blockiert nicht. Es ist nicht erforderlich, XHR-Anforderungen in einem separaten Thread auszuführen. (Natürlich möchten Sie in einer modernen App WebSockets anstelle von Polling verwenden.)

— josh3736

@ josh3736 - Sie haben Recht, aber ich bin jetzt gespannt, ob das Ausführen vieler paralleler XHR-Aync-Anforderungen den Browser irgendwie unglücklich machen kann. Außerdem benötigen Sie lokale Ressourcen, um XHR-Antworten zu verarbeiten, bei denen die Mitarbeiter möglicherweise hilfreich sind.

— DVK

Wenn sich alle parallelen Anforderungen auf demselben Server befinden, erreichen Sie das Limit pro Hostname zwischen 2 und 9 gleichzeitigen Verbindungen. (Ich würde davon ausgehen, dass das Limit für alle Verbindungen gilt, unabhängig davon , ob sie vom Hauptthread oder von einem Worker initiiert wurden.) Wenn 10 gleichzeitige Anforderungen gleichzeitig ausgeführt werden, müssen Sie wahrscheinlich das Design Ihrer Anwendung überdenken.

— Josh3736

Entschuldigen Sie meine einfache Frage, aber was bezeichnen Sie in Ihrem obigen Beispiel als "#"?

— Kluge Bohnen

Ich habe sie verwendet, um größere Datenmengen vom Browser an den Server zu senden. Natürlich können Sie dies mit regulären AJAX-Aufrufen tun, aber wenn dies eine der wertvollen Verbindungen pro Hostname beansprucht. Wenn der Benutzer während dieses Vorgangs einen Seitenübergang durchführt (z. B. auf einen Link klickt), verschwinden Ihre JavaScript-Objekte von der vorherigen Seite und Sie können keine Rückrufe verarbeiten. Wenn ein Web-Worker verwendet wird, erfolgt diese Aktivität außerhalb des Bandes, sodass Sie eine bessere Garantie dafür haben, dass sie abgeschlossen wird.

— Kevin Hakanson
quelle

Sie müssen die Nachricht jedoch mit dem Web-Worker austauschen. Wann verdienen die Kosten dieser Operation den Nutzen?

— Danielo515

Ein weiterer Anwendungsfall:

Komprimieren / Dekomprimieren von Dateien im Hintergrund, wenn Sie viele Bilder und andere Mediendateien haben, die im komprimierten Format vom Server ausgetauscht werden.

— sbr
quelle

Dies sollte in JavaScript nicht passieren. Bilder werden bereits mithilfe von Algorithmen komprimiert (PNG, JPEG), um Bilddaten effizient zu komprimieren. Wenn Sie eine weitere Komprimierungsschicht darüber legen, kann dies die Datengröße tatsächlich erhöhen . Bei anderen Datentypen (z. B. einer großen JSON-Datei) sollte die Komprimierung vom Browser mithilfe von Standard-HTTP-Gzipping durchgeführt werden. Wenn Sie in JavaScript komprimieren, machen Sie es wahrscheinlich falsch .

— Josh3736

Ich sehe einige Benutzer, die den Anwendungsfall disqualifizieren, aber hier ist, was ich sagen wollte. Stellen Sie sich eine Anwendung wie MS Word vor, wie einen leistungsstarken Dokumenteditor, mit dem Sie Bilder, Musikdateien, Daten, Excel-Tabellen usw. in EINE Datei einbetten können. und denken Sie daran, dass Sie einen webbasierten Client und einen Desktop-Client sowie einen IOS / Android-Client haben. Für diese Art von Anwendungsfall können Sie den gesamten Dateiinhalt in einer Zip-Datei speichern und dann auf jedem Client entpacken.

— sbr

Das Instapaper-Lesezeichen komprimiert die gespeicherte Seite, bevor sie an den Server gesendet wird. Das spart Zeit und Bandbreite.

— Stevendaniels

@ josh3736 Ein Browser kann nur eine Datei von einem Webserver (oder Browser-Cache) mit einem Gunzip versehen. Es kann keine Daten aus dem lokalen Speicher oder aus einem Websocket dekomprimieren und es kann überhaupt nicht komprimiert werden. Web-Apps senden immer mehr Daten in den Upstream, und die Komprimierung hierfür ist äußerst nützlich. Gleichermaßen gültig vor einem Jahr, als dies veröffentlicht wurde: Wenn Sie sich keine gültigen Anwendungsfälle für die JavaScript-Komprimierung vorstellen können, fehlt Ihnen wahrscheinlich die Vorstellungskraft.

— Adria

@Adria: Der Websocket-Standard fügt derzeit Komprimierungsunterstützung hinzu . Wenn Sie mit im Browser ( <canvas>) generierten Bildern arbeiten , können Sie die Bilddaten in einem komprimierten Format (dh PNG) abrufen. Mein Punkt war nicht, dass es niemals angebracht ist, in JS zu komprimieren; Mein Punkt war, dass dies in den meisten Fällen nicht der Fall ist , und in den meisten Fällen - insbesondere beim Umgang mit Bildern, worüber diese Antwort spricht - gibt es eine bessere Alternative zum Rollen Ihrer eigenen Komprimierung.

— Josh3736