From 6772831200d14c2436aea2d0c837f40dbf12156f Mon Sep 17 00:00:00 2001 From: SphinxKnight Date: Sun, 26 Sep 2021 13:11:47 +0200 Subject: Prepare Web API section for Markdown conversion (#2464) * Remove summary classes and ids * Remove unecessary hidden * Remove useless span filled with useless attributes / ids * Remove useless font * Remove notranslate * Remove id in other elements than headings * Remove name attributes * Remove
 for JS w/ language-js class

* Remove 
 for HTML w/ language-html class

* Remove 
 for other lang w/ language-* class

* Rm highlighted line in code samples

* fix links, internal, external, absolute URLs

* missing file from last commit

* Fix styles errors apart from table + some classes

* Fix notes and warnings (+ some other :x)

* fix typo during merge which broke a doc

* aand forgot a conflict

* fix remaining classes of errors except dls and images

* Fix dls

* Fix images (deki/mozillademos) and remaining style issues

* Remove script tag from svg file

* Remove script tag from svg fileS

* Compress SVG files for CI
---
 .../index.html                                     |  6 ++---
 files/fr/web/api/web_workers_api/index.html        | 10 ++++----
 .../structured_clone_algorithm/index.html          | 14 ++++++-----
 .../web_workers_api/using_web_workers/index.html   | 27 ++++++++++++----------
 4 files changed, 30 insertions(+), 27 deletions(-)

(limited to 'files/fr/web/api/web_workers_api')

diff --git a/files/fr/web/api/web_workers_api/functions_and_classes_available_to_workers/index.html b/files/fr/web/api/web_workers_api/functions_and_classes_available_to_workers/index.html
index f43d902d87..bcd5c59b3c 100644
--- a/files/fr/web/api/web_workers_api/functions_and_classes_available_to_workers/index.html
+++ b/files/fr/web/api/web_workers_api/functions_and_classes_available_to_workers/index.html
@@ -134,12 +134,12 @@ original_slug: Web/API/Worker/Functions_and_classes_available_to_workers
    Crée un nouveau {{ domxref("Worker") }}. Oui, les workers peuvent engendrer des workers supplémentaires.
    {{CompatGeckoDesktop("1.9.1")}}
    10.0
-   {{CompatNo}} Voir crbug.com/31666
+   {{CompatNo}} Voir crbug.com/31666
    {{CompatNo}}
   
   
    {{ domxref("URL") }}
-   Les workers peuvent utiliser les méthodes statiques URL.createObjectURL et URL.revokeObjectURL avec les objets {{domxref("Blob")}} accessibles au worker.
+ Les workers peuvent utiliser les méthodes statiques URL.createObjectURL et URL.revokeObjectURL avec les objets {{domxref("Blob")}} accessibles au worker.
Les workers peuvent aussi créer une nouvelle URL en utilisant le constructeur {{domxref("URL.URL", "URL()")}} et appeler n'importe quelle méthode normale sur l'objet retourné. {{CompatGeckoDesktop(21)}} et {{CompatGeckoDesktop(26)}} pour le constructeur URL() {{CompatNo}} @@ -236,6 +236,6 @@ original_slug: Web/API/Worker/Functions_and_classes_available_to_workers

Voir aussi

diff --git a/files/fr/web/api/web_workers_api/index.html b/files/fr/web/api/web_workers_api/index.html index e218058f53..57afda034b 100644 --- a/files/fr/web/api/web_workers_api/index.html +++ b/files/fr/web/api/web_workers_api/index.html @@ -6,9 +6,7 @@ tags: - DOM translation_of: Web/API/Web_Workers_API --- -
-
{{DefaultAPISidebar("Web Workers API")}}
-
+
{{DefaultAPISidebar("Web Workers API")}}

Les Web Workers sont un mécanisme grâce auquel les instructions d'un script peuvent être exécutés dans un thread en arrière-plan séparé du thread d'exécution principal d'une application web. Cela a pour avantage qu'un traitement laborieux peut être réalisé dans un thread séparé, permettant au thread principal (généralement l'interface utilisateur) de fonctionner sans blocage ni ralentissement.

@@ -20,7 +18,7 @@ translation_of: Web/API/Web_Workers_API

Les données sont envoyées entre les workers et le thread principal au moyen d'un sytème de messages — des deux côtés les messages sont envoyés en utilisant la méthode postMessage(), et la réponse leur parvient au moyen du gestionnaire d'événement onmessage (le message est contenu dans l'attribut data de l'événement {{event("Message")}}.) Les données sont copiées plutôt que partagées.

-

Les workers peuvent à leur tour engendrer de nouveaux workers, aussi longtemps que ces workers partagent la même origine que la page parente.  De plus, les workers peuvent utiliser XMLHttpRequest pour les E/S réseau, à l'exception que les attributs responseXML et channel de XMLHttpRequest retournent toujours null.

+

Les workers peuvent à leur tour engendrer de nouveaux workers, aussi longtemps que ces workers partagent la même origine que la page parente.  De plus, les workers peuvent utiliser XMLHttpRequest pour les E/S réseau, à l'exception que les attributs responseXML et channel de XMLHttpRequest retournent toujours null.

En plus des workers dédiés, il y a d'autres types de worker :

@@ -31,8 +29,8 @@ translation_of: Web/API/Web_Workers_API
  • Les Audio Workers donne la possibilité d'effectuer directement dans le contexte d'un worker web un traitement audio scripté.
  • -
    -

    Remarque: Selon les Spécifications de Web Worker, les erreurs dans les workers ne devraient pas déborder (voir {{bug(1188141)}}). Cela a été implémenté dans Firefox 42.

    +
    +

    Note : Selon les Spécifications de Web Worker, les erreurs dans les workers ne devraient pas déborder (voir {{bug(1188141)}}). Cela a été implémenté dans Firefox 42.

    Les interfaces Web Worker

    diff --git a/files/fr/web/api/web_workers_api/structured_clone_algorithm/index.html b/files/fr/web/api/web_workers_api/structured_clone_algorithm/index.html index 1fc2be25c8..ff872b99ad 100644 --- a/files/fr/web/api/web_workers_api/structured_clone_algorithm/index.html +++ b/files/fr/web/api/web_workers_api/structured_clone_algorithm/index.html @@ -4,7 +4,7 @@ slug: Web/API/Web_Workers_API/Structured_clone_algorithm translation_of: Web/API/Web_Workers_API/Structured_clone_algorithm original_slug: Web/API/Web_Workers_API/algorithme_clonage_structure --- -

    L’algorithme de clonage structuré est un nouvel algorithme défini par la spécification HTML5 pour sérialiser les objets JavaScript complexes. Il est plus puissant que JSON en cela qu’il supporte la sérialisation d’objets contenant des graphes cycliques — des objets peuvent faire référence à des objets faisant référence à d’autres objets dans le même graphe. De plus, dans certains cas, l’algorithme de clonage structuré peut être plus efficace que JSON.

    +

    L’algorithme de clonage structuré est un nouvel algorithme défini par la spécification HTML5 pour sérialiser les objets JavaScript complexes. Il est plus puissant que JSON en cela qu’il supporte la sérialisation d’objets contenant des graphes cycliques — des objets peuvent faire référence à des objets faisant référence à d’autres objets dans le même graphe. De plus, dans certains cas, l’algorithme de clonage structuré peut être plus efficace que JSON.

    L’algorithme, essentiellement, parcourt tous les champs de l’objet original, copiant les valeurs de chaque champ dans un nouvel objet. Si un champ est lui-même un objet avec des champs, ces champs sont parcourus de manière récursive jusqu’à ce que chaque champ et sous-champ aient été copié dans le nouvel objet.

    @@ -13,7 +13,7 @@ original_slug: Web/API/Web_Workers_API/algorithme_clonage_structure

    Il y a quelques avantages notables à utiliser l’algorithme de clonage structuré plutôt que JSON :

      -
    • Le clonage structuré peut copier des objets RegExp.
    • +
    • Le clonage structuré peut copier des objets RegExp.
    • Le clonage structuré peut copier des objets {{ domxref("Blob") }}, {{ domxref("File") }} et {{ domxref("FileList") }}.
    • Le clonage structuré peut copier des objets {{ domxref("ImageData") }}. Les dimensions du {{ domxref("CanvasPixelArray") }} du clone correspondront à celles de l’original, et il recevra une copie des mêmes données de pixels.
    • Le clonage structuré copie correctement les objets contenant des graphes de références cycliques.
    • @@ -22,11 +22,11 @@ original_slug: Web/API/Web_Workers_API/algorithme_clonage_structure

      Ce qui ne marche pas avec le clonage structuré

        -
      • Les objets Error et Function ne peuvent pas être copiés par l’algorithme de clonage structuré ; toute tentative de le faire émettra une exception DATA_CLONE_ERR.
      • +
      • Les objets Error et Function ne peuvent pas être copiés par l’algorithme de clonage structuré ; toute tentative de le faire émettra une exception DATA_CLONE_ERR.
      • De la même manière, toute tentative de cloner des nœuds DOM émettra une exception DATA_CLONE_ERR.
      • Certains paramètres d’objets ne sont pas préservés :
          -
        • Le champ lastIndex des objets RegExp n’est pas préservé.
        • +
        • Le champ lastIndex des objets RegExp n’est pas préservé.
        • Les descripteurs de propriétés, accesseurs et mutateurs (ainsi que les fonctionnalités de métadonnées similaires) ne sont pas copiés. Par exemple, si un objet est marqué en lecture seule via un descripteur de propriété, il sera en lecture et écriture dans le clone, car c’est la condition par défaut.
        • La chaîne de prototypes n’est ni parcourue, ni copiée.
        @@ -141,12 +141,14 @@ original_slug: Web/API/Web_Workers_API/algorithme_clonage_structure }
    -
      Note : Cet algorithme ne prend en charge que les objets spéciaux RegExp, Array et Date. Vous pouvez implémenter d’autres cas spéciaux selon vos besoins.
    +
    +

    Note : Cet algorithme ne prend en charge que les objets spéciaux RegExp, Array et Date. Vous pouvez implémenter d’autres cas spéciaux selon vos besoins.

    +

    Voir aussi

      -
    • Spécification HTML5 : Passage sécurisé de données structurées
    • +
    • Spécification HTML5 : Passage sécurisé de données structurées
    • {{ domxref("window.history") }}
    • {{ domxref("window.postMessage()") }}
    • Web Workers
    • diff --git a/files/fr/web/api/web_workers_api/using_web_workers/index.html b/files/fr/web/api/web_workers_api/using_web_workers/index.html index f6eb904fd1..dd63df8aa4 100644 --- a/files/fr/web/api/web_workers_api/using_web_workers/index.html +++ b/files/fr/web/api/web_workers_api/using_web_workers/index.html @@ -11,7 +11,7 @@ original_slug: Web/API/Web_Workers_API/Utilisation_des_web_workers ---
      {{DefaultAPISidebar("Web Workers API")}}
      -

      Les Web Workers sont un outil permettant au contenu web d'exécuter des scripts dans des tâches (threads) d'arrière-plan. Le thread associé au worker peut réaliser des tâches sans qu'il y ait d'interférence avec l'interface utilisateur. De plus, les web workers peuvent réaliser des opérations d'entrée/sortie grâce à XMLHttpRequest (bien que les attributs responseXML et channel soient nécessairement vides dans ces cas). Une fois créé, un worker peut envoyer des messages au code JavaScript qui l'a créé. De même, le script initial peut envoyer des messages au worker. Cette communication s'effectue grâce à des gestionnaires d'évènements. Dans cet article, nous verrons une introduction à l'utilisation des web workers.

      +

      Les Web Workers sont un outil permettant au contenu web d'exécuter des scripts dans des tâches (threads) d'arrière-plan. Le thread associé au worker peut réaliser des tâches sans qu'il y ait d'interférence avec l'interface utilisateur. De plus, les web workers peuvent réaliser des opérations d'entrée/sortie grâce à XMLHttpRequest (bien que les attributs responseXML et channel soient nécessairement vides dans ces cas). Une fois créé, un worker peut envoyer des messages au code JavaScript qui l'a créé. De même, le script initial peut envoyer des messages au worker. Cette communication s'effectue grâce à des gestionnaires d'évènements. Dans cet article, nous verrons une introduction à l'utilisation des web workers.

      L'API Web Workers

      @@ -20,14 +20,14 @@ original_slug: Web/API/Web_Workers_API/Utilisation_des_web_workers

      Le contexte du worker est représenté par un objet {{domxref("DedicatedWorkerGlobalScope")}} pour les workers dédiés et par un objet {{domxref("SharedWorkerGlobalScope")}} sinon. Un worker dédié est uniquement accessible au travers du script qui l'a déclenché tandis qu'un worker partagé peut être utilisé par différents scripts.

      -

      Note : Voir la page d'entrée pour l'API Web Workers pour consulter la documentation de référence sur les workers et d'autres guides.

      +

      Note : Voir la page d'entrée pour l'API Web Workers pour consulter la documentation de référence sur les workers et d'autres guides.

      Il est possible d'exécuter n'importe quel code JavaScript dans le thread du worker, à l'exception des méthodes de manipulation du DOM ou de certaines propriétés et méthodes rattachées à {{domxref("window")}}. On notera cependant qu'on peut tout à fait utiliser certaines API rendues disponibles via window comme les WebSockets, les API de stockage de données telles que IndexedDB. Pour plus de détails, voir les fonctions et classes disponibles au sein des workers.

      Les données sont échangées entre le thread du worker et le thread principal par l'intermédiaire de messages. Chaque partie peut envoyer des messages à l'aide de la méthode postMessage() et réagir aux messages reçus grâce au gestionnaire d'évènement onmessage (le message sera contenu dans l'attribut data de l'évènement {{event("Message")}} associé). Les données sont copiées dans le message, elles ne sont pas partagées.

      -

      Les workers peuvent également déclencher la création d'autres workers tant que ceux-ci restent hébergés sur la même origine que la page parente. De plus, les workers pourront utiliser XMLHttpRequest pour effectuer des opérations réseau mais les attributs responseXML et channel de XMLHttpRequest renverront nécessairement null.

      +

      Les workers peuvent également déclencher la création d'autres workers tant que ceux-ci restent hébergés sur la même origine que la page parente. De plus, les workers pourront utiliser XMLHttpRequest pour effectuer des opérations réseau mais les attributs responseXML et channel de XMLHttpRequest renverront nécessairement null.

      Les workers dédiés

      @@ -47,10 +47,9 @@ original_slug: Web/API/Web_Workers_API/Utilisation_des_web_workers

      La création d'un nouveau worker est assez simple. On appellera le constructeur {{domxref("Worker.Worker", "Worker()")}} en indiquant l'URI du script à exécuter dans le thread associé au worker (main.js) :

      -
      +
      var monWorker = new Worker('worker.js');
       
      -

      Envoyer des messages au worker et y réagir

      @@ -88,9 +87,13 @@ deuxiemeNombre.onchange = function() {

      Ici, nous récupérons les données grâce à l'attribut data de l'évènement et nous mettons à jour le contenu du paragraphe avec l'attribut textContent de l'élément. Ainsi, l'utilisateur peut visualiser le résultat du calcul.

      -
      Note : On notera que onmessage et postMessage() doivent être rattachés à un objet Worker lorsqu'ils sont utilisés depuis le thread principal (ici, c'était monWorker) mais pas lorsqu'ils sont employés depuis le worker. En effet, dans le worker, c'est le worker qui constitue la portée globale et qui met à disposition ces méthodes.
      +
      +

      Note : On notera que onmessage et postMessage() doivent être rattachés à un objet Worker lorsqu'ils sont utilisés depuis le thread principal (ici, c'était monWorker) mais pas lorsqu'ils sont employés depuis le worker. En effet, dans le worker, c'est le worker qui constitue la portée globale et qui met à disposition ces méthodes.

      +
      -
      Note : Lorsqu'un message est envoyé d'un thread à l'autre, ses données sont copiées. Elles ne sont pas partagées. Voir ci-après pour plus d'explications à ce sujet.
      +
      +

      Note : Lorsqu'un message est envoyé d'un thread à l'autre, ses données sont copiées. Elles ne sont pas partagées. Voir ci-après pour plus d'explications à ce sujet.

      +

      Clôturer un worker

      @@ -104,7 +107,7 @@ deuxiemeNombre.onchange = function() {

      Lorsqu'une erreur d'exécution se produit avec le worker, son gestionnaire d'évènement onerror est appelé et reçoit un évènement error qui implémente l'interface ErrorEvent.

      -

      Cet évènement ne bouillonne (bubble) pas et peut être annulé. Pour empêcher les conséquences par défaut, on pourra utiliser la méthode preventDefault() rattachée à l'évènement d'erreur.

      +

      Cet évènement ne bouillonne (bubble) pas et peut être annulé. Pour empêcher les conséquences par défaut, on pourra utiliser la méthode preventDefault() rattachée à l'évènement d'erreur.

      L'évènement décrivant l'erreur possède notamment trois propriétés intéressantes :

      @@ -132,7 +135,9 @@ importScripts('//example.com/hello.js'); /* importe un script d'une autre origin

      Lors d'un import, le navigateur chargera chacun des scripts puis l'exécutera. Chaque script pourra ainsi mettre à disposition des objets globaux qui pourront être utilisés par le worker. Si le script ne peut pas être chargé, une exception NETWORK_ERROR sera levée et le code assicé ne sera pas exécuté. Le code exécuté précédemment (y compris celui-ci reporté à l'aide de {{domxref("window.setTimeout()")}}) continuera cependant d'être fonctionnel. Les déclarations de fonction situées après importScripts() sont également exécutées car évaluées avant le reste du code.

      -
      Note : Les scripts peuvent être téléchargés dans n'importe quel ordre mais ils seront exécutés dans l'ordre des arguments passés à importScripts() . Cet exécution est effectuée de façon synchrone et importScripts() ne rendra pas la main tant que l'ensemble des scripts n'auront pas été chargés et exécutés.
      +
      +

      Note : Les scripts peuvent être téléchargés dans n'importe quel ordre mais ils seront exécutés dans l'ordre des arguments passés à importScripts() . Cet exécution est effectuée de façon synchrone et importScripts() ne rendra pas la main tant que l'ensemble des scripts n'auront pas été chargés et exécutés.

      +

      Les workers partagés

      @@ -215,9 +220,7 @@ Pour appliquer une règle de sécurité au worker, il faudra fournir un
      Si l'origine du script du worker est un identifiant global unique (si son URL utilise le schéma data:// ou blob:// par exemple), le worker héritera du CSP associé au document responsable de sa création. -
      - -

      Échanger des données avec les workers : plus de détails

      +

      Échanger des données avec les workers : plus de détails

      Les données échangées entre le document principal et les workers sont copiées et non partagées. Lorsqu'ils sont envoyés au worker, les objets sont sérialisés (puis désérialisés à leur réception). La page et le worker ne partagent pas le même exemplaire et on a donc deux versions d'une part et d'autre. La plupart des navigateurs implémentent cette approche avec une clonage structurel.

      -- cgit v1.2.3-54-g00ecf