recherche

Maison >interface Web >js tutoriel >Inline Web Workers : quand et comment les utiliser ?

Inline Web Workers : quand et comment les utiliser ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-10-30 00:14:02445parcourir

Inline Web Workers: When and How to Use Them?

Travailleurs Web en ligne : un guide complet

Bien que les travailleurs Web soient généralement définis dans des fichiers JavaScript distincts, il existe une méthode pour les créer en ligne. dans le même fichier HTML. Cette approche est avantageuse lorsque l'on vise à minimiser le nombre de fichiers distincts à distribuer, en particulier lors de l'utilisation d'outils tels que le compilateur de fermeture pour l'optimisation du code.

Création de travailleurs Web en ligne

Les travailleurs Web en ligne utilisent Blob() pour créer un descripteur d'URL vers le code du travailleur sous forme de chaîne. Cela permet au travailleur d'être inclus directement dans le fichier HTML. Voici un exemple complet :

HTML avec code de travail en ligne :

<code class="html"><!DOCTYPE html>
<script id="worker1" type="javascript/worker">
  // This script won't be parsed by JS engines due to its type.
  self.onmessage = function(e) {
    self.postMessage('msg from worker');
  };
</script></code>

Code JavaScript principal :

<code class="javascript">var blob = new Blob([
  document.querySelector('#worker1').textContent
], { type: "text/javascript" });

// Use window.webkitURL.createObjectURL() for Chrome versions below 11.
var worker = new Worker(window.URL.createObjectURL(blob));
worker.onmessage = function(e) {
  console.log("Received: " + e.data);
};
worker.postMessage("hello"); // Start the worker.</code>

Dans cet exemple, le code du travailleur en ligne est défini dans le fichier