L'objetSharedArrayBuffer est utilisé afin de représenter un tampon de données binaires brutes générique de longueur fixe. Il est semblable à l'objetArrayBuffer, mais peut ici être utilisé pour créer différentes vues sur une même mémoire partagée. À la différence d'unArrayBuffer, unSharedArrayBuffer n'est pasun objet transférable.

Description

Allouer et partager la mémoire

Pour partager une zone mémoire entre plusieurs objetsSharedArrayBuffer d'un agent à un autre (ici un agent correspond au programme principal de la page web ou à l'un de sesweb workers), on utiliserapostMessage() etle clonage structuré.

L'algorithme de clonage structuré permet d'envoyer des objetsSharedArrayBuffers etTypedArrays vers des objetsSharedArrayBuffer. Dans les deux cas, l'objetSharedArrayBuffer est transmis au récepteur, ce qui crée un nouvel objetSharedArrayBuffer, privé, au sein de l'agent qui reçoit (comme avecArrayBuffer). Cependant, le bloc de mémoire référencé par les deux objetsSharedArrayBuffer est bien le même bloc. Aussi, si un agent interagit avec cette zone, l'autre agent pourra voir les modifications.

let sab = new SharedArrayBuffer(1024);worker.postMessage(sab);

Mettre à jour et synchroniser la mémoire partagée avec les opérations atomiques

La mémoire partagée peut être créée et mise à jour de façon simultanée entre lesworkers et lethread d'exécution principal. Selon le système (le processeur, le système d'exploitation, le navigateur), cela peut prendre du temps avant que le changement soit propagé sur l'ensemble des contextes. Pour que la synchronisation s'effectue, on doit utiliserdes opérations atomiques.

Les API qui utilisent des objetsSharedArrayBuffer

• WebGLRenderingContext.bufferData()
• WebGLRenderingContext.bufferSubData()
• WebGL2RenderingContext.getBufferSubData()

Contraintes de sécurité

La mémoire partagée et les chronomètres de haute précision ont étédésactivés début 2018 suite à la vulnérabilitéSpectre. En 2020, une nouvelle approche, sécurisée, a été mise en place afin de réactiver la mémoire partagée. En suivant quelques règles de sécurité,postMessage() ne lève plus d'exception pour les objetsSharedArrayBuffer et une mémoire partagée entre lesthreads est disponible.

Pour commencer, le document doit être mis à disposition dansun contexte sécurisé.

Pour les documents de plus haut niveau, deux en-têtes HTTP doivent être utilisés pour isoler le site des origines tierces :

• Cross-Origin-Opener-Policy avec la valeursame-origin (ce qui protège l'origine des éventuels attaquants)
• Cross-Origin-Embedder-Policy avec la valeurrequire-corp (ce qui protège les éventuelles victimes de votre origine)

Cross-Origin-Opener-Policy: same-originCross-Origin-Embedder-Policy: require-corp

Pour vérifier si l'isolation envers les origines tierces a réussi, vous pouvez vérifier la propriétécrossOriginIsolated qui est disponible dans les contextes de la fenêtre et desworkers :

if (crossOriginIsolated) {  // on poste le SharedArrayBuffer} else {  // on fait autre chose}

Voir aussiles changements prévus quant à la mémoire partagée pour les différents navigateurs.

Obligation d'utiliser l'opérateurnew

Les constructeursSharedArrayBuffer doivent être utilisés avec l'opérateurnew. Si on appelle un constructeurSharedArrayBuffer comme une fonction, sansnew, cela lèvera une exceptionTypeError.

var sab = SharedArrayBuffer(1024);// TypeError: appeler le constructeur natif SharedArrayBuffer sans// new est interdit

var sab = new SharedArrayBuffer(1024);

Constructeur

SharedArrayBuffer()

Crée un nouvel objetSharedArrayBuffer.

Propriétés des instances

SharedArrayBuffer.prototype.byteLength

La taille du tableau, exprimée en octets. Celle-ci est déterminée à la construction du tableau et ne peut pas être modifiée par la suite, elle est accessibleen lecture seule uniquement.

Méthodes des instances

SharedArrayBuffer.prototype.slice(debut, fin)

Renvoie un nouvel objetSharedArrayBuffer dont le contenu et une copie des octets de l'objetSharedArrayBuffer courant entre l'indice de début (inclus) et l'indice de fin (exclus). Si l'un des deux indices est négatif, il est relatif à la fin du tableau plutôt qu'au début.

Exemples

Créer un nouvel objetSharedArrayBuffer

let sab = new SharedArrayBuffer(1024);

Découper un objetSharedArrayBuffer

sab.slice(); // SharedArrayBuffer { byteLength: 1024 }sab.slice(2); // SharedArrayBuffer { byteLength: 1022 }sab.slice(-2); // SharedArrayBuffer { byteLength: 2 }sab.slice(0, 1); // SharedArrayBuffer { byteLength: 1 }

Utiliser un tampon WebGL

const canvas = document.querySelector("canvas");const gl = canvas.getContext("webgl");const buffer = gl.createBuffer();gl.bindBuffer(gl.ARRAY_BUFFER, buffer);gl.bufferData(gl.ARRAY_BUFFER, sab, gl.STATIC_DRAW);

Spécifications

Compatibilité des navigateurs

Voir aussi

• Atomics
• ArrayBuffer
• Les tableaux typés en JavaScript
• LesWeb Workers
• parlib-simple — une bibliothèque qui fournit des abstractions pour synchroniser et distribuer des tâches
• La mémoire partagée — un rapide tutoriel (en anglais)
• A Taste of JavaScript's New Parallel Primitives — Mozilla Hacks (en anglais)