SharedWorker

A interface SharedWorker representa um tipo de worker específico que pode ser acedido  a partir de vários contextos de navegação, tais como várias janelas, iframes ou até workers. Eles implementam uma interface diferente do que os workers dedicados e têm um âmbito global diferente, SharedWorkerGlobalScope.

SharedWorker()

Cria um web worker partilhado que executa uma script na URL indicada.

Esta interface também herda propriedades de EventTarget de qual se deriva, e implementa propriedades de AbstractWorker.

AbstractWorker.onerror

É um EventListener chamado quando um ErrorEvent do tipo error sai do worker.

SharedWorker.port Read only

Devolve um objeto MessagePort usado para controlar e comunicar com o worker partilhado.

Esta interface também herda métodos de EventTarget de qual se deriva, e implementa métodos de AbstractWorker.

No nosso exemplo básico dum worker partilhado, temos duas páginas de HTML, cada qual usa JavaScript para fazer um simples cálculo. Os scripts diferentes estão a utilizar o mesmo ficheiro de worker para fazer os cálculos — ambos podem-no aceder, mesmo se as páginas estiverem a correr em janelas diferentes.

O seguinte snippet de código demonstra a criação dum objeto SharedWorker usando o construtor SharedWorker(). Ambas scripts contêm isto:

var myWorker = new SharedWorker('worker.js');

Ambas scripts acedem ao worker através dum objeto MessagePort criado usando a propriedade SharedWorker.port. Se o evento onmessage foi adicionado usando addEventListener, a porta é manualmente criada usando o seu método start():

myWorker.port.start();

Quando a porta é iniciada, ambos scripts enviam mensagens ao worker e processão mensagens vindas do worker usando port.postMessage() e port.onmessage, respetivamente:

first.onchange = function() {
  myWorker.port.postMessage([first.value,second.value]);
  console.log(' Mensagem enviada ao worker');
}

second.onchange = function() {
  myWorker.port.postMessage([first.value,second.value]);
  console.log(' Mensagem enviada ao worker');
}

myWorker.port.onmessage = function(e) {
  result1.textContent = e.data;
  console.log(' Mensagem recebida do worker');
}

Dentro do worker usamos o handler SharedWorkerGlobalScope.onconnect para nos ligarmos à mesma porta a que referimos antes. As portas associadas a esse worker são acessíveis através da propriedade ports do evento connect — nós depois usamos o método start() de MessagePort para iniciar a porta, e o handler onmessage para lidar com as mensagens enviadas dos threads principais.

onconnect = function(e) {
  var port = e.ports[0];

  port.addEventListener('message', function(e) {
    var workerResult = 'Result: ' + (e.data[0] * e.data[1]);
    port.postMessage(workerResult);
  });

  port.start(); // Necessário quando se usa addEventListener. Senão é chamado implicitamente pelo setter de onmessage.
}

• Worker
• Utilização de workers da Web