O que são Web workers

Web workers são um recurso do JavaScript que nos permite executar scripts em segundo plano sem bloquear o thread principal. Isso é útil quando precisamos executar tarefas de execução longa que podem congelar a interface do usuário, como cálculos complexos ou processamento de dados.

Web workers são arquivos JavaScript separados executados em seus próprios threads. Eles são criados usando o Workerconstrutor e se comunicam com o thread principal usando os métodos postMessage()e onmessage. Nesta postagem do blog, exploraremos como usar web workers em JavaScript com exemplos e contexto fácil de entender para leitores maiores de 18 anos.

Criando um Web Worker

Para criar um web worker, precisamos criar um novo arquivo JavaScript que será executado em segundo plano. Por exemplo, vamos criar um arquivo chamado worker.jsque calcula o fatorial de um determinado número:

// worker.js

function calculateFactorial(n) {
  let result = 1;
  for (let i = 2; i <= n; i++) {
    result *= i;
  }
  return result;
}

onmessage = function(event) {
  const n = event.data;
  const result = calculateFactorial(n);
  postMessage(result);
};

Para usar este trabalhador em nosso script principal, precisamos criar uma nova instância do Workerconstrutor e passar o caminho para nosso arquivo de trabalho:

// index.js

const factorialWorker = new Worker('worker.js');

factorialWorker.postMessage(10);

factorialWorker.onmessage = function(event) {
  const result = event.data;
  console.log(`The factorial of 10 is ${result}`);
};

Observação: os workers precisam de um serviço hospedado para serem executados e não podem ser executados em uma página html executando apenas “[fileName].html”. Para fazer os trabalhadores funcionarem, as declarações de importação precisam ser adicionadas e o método precisa ser alterado

const customWorker = new Worker(
    new URL('./worker.js', import.meta.url),
    { type: 'module' }
);

A execução do script acima produzirá o resultado no console: “O fatorial de 10 é 3628800”.

Limitações dos Web Workers

Embora os web workers sejam úteis para descarregar tarefas computacionais pesadas do thread principal, eles têm algumas limitações. Por exemplo, os web workers não podem acessar o DOM ou qualquer outra API disponível para o thread principal. Eles também não podem compartilhar memória com o thread principal, o que significa que precisamos usar a passagem de mensagens para a comunicação entre os dois threads.

Além disso, os web workers não são suportados em alguns navegadores mais antigos . Antes de usar web workers em seu aplicativo, é importante verificar se eles são suportados em todos os navegadores que você está direcionando.

Conclusão

Web workers são um recurso poderoso do JavaScript que nos permite executar tarefas de longa duração em segundo plano sem bloquear o thread principal. Eles são fáceis de criar e usar e podem melhorar significativamente o desempenho de nossos aplicativos. No entanto, os web workers têm algumas limitações e é importante mantê-las em mente ao usá-las em seu aplicativo.

Espero que esta introdução aos web workers tenha sido útil e informativa para leitores de todo o mundo.