O trabalhador da web dedicado (trabalhador da web dedicado) fornece uma maneira simples de permitir que o conteúdo da web execute o script em segundo plano. Depois que o trabalhador for criado, ele pode passar a mensagem para a função de monitoramento de eventos especificada por seu criador, para que todas as tarefas geradas pelo trabalhador recebam essas mensagens. O thread do trabalhador pode executar tarefas sem interferência de interferência. Além disso, ele também pode usar o XMLHTTPREQUEST (embora os dois valores de atributo de respostaxml e canal sejam sempre nulos) para executar operações de E/S. Este artigo fornece exemplos e detalhes para compensar os documentos anteriores. A função fornecida ao trabalhador lista as funções suportadas pelo trabalhador.
A interface do trabalhador gerará um thread de nível operacional real. Se você não tiver cuidado, a simultaneidade terá um impacto interessante no seu código. No entanto, para trabalhadores da web, os pontos de comunicação com outros threads serão cuidadosamente controlados, o que significa que é difícil para você causar complicação. Você não tem como acessar componentes de segurança não thread ou DOMS. Então, se você não gastar algum esforço, não pode cometer erros. Gerar trabalhador
É muito simples criar um novo trabalhador. Tudo o que você precisa fazer é ligar para o construtor Worker () e especificar um URI que precisa executar um script que está em execução no tópico do trabalhador. Função específica de processamento de eventos.
var myworker = novo trabalhador (my_task.js);
Ou, você também pode usar addEventListener ():
var myworker = novo trabalhador (my_task.js); O trabalhador.
A primeira linha no exemplo cria um novo tópico de trabalhador. O terceiro ato define a função de monitoramento do evento de mensagem. Quando o trabalhador chama sua própria função PostMessage (), essa função de processamento de eventos é chamada. Finalmente, o tópico do trabalhador foi lançado na sétima linha. NOTA: O URI do parâmetro que transmite o construtor do trabalhador deve seguir a estratégia homóloga. Atualmente, diferentes fabricantes de navegadores ainda são diferentes sobre os quais os URIs devem seguir as estratégias homólogas; BLOB URI.
Passar dadosOs dados transmitidos entre a página inicial e o trabalhador são copiados, não compartilhados. O objeto passado para o trabalhador precisa ser serializado e, em seguida, o próximo final precisa ser serializado. A página não compartilha o mesmo exemplo que o Trabalhador. A maioria dos navegadores usa cópia estruturada para atingir esse recurso.
Antes de descer, com o objetivo de ensinar, crie uma função chamada EmulatingMessage ().
Função emulatingMessage (vVal) {return avalia; // objectAlert (tipoof emulandoMessage (exemplo1); número // teste #2VAR Exemplo2 = true; alert (typeof exemplo2); Boolean // Teste #3V #3V ARMELHO3 = NOVA String (Hello World); , Idade: 43}; Var Exemplo5 = Novo Animal (CAT, 3);O valor que não é compartilhado é chamado de mensagem. Vamos falar sobre trabalhador, você pode usar o PostMessage () para passar a mensagem para o thread principal ou enviá -lo de volta do thread principal. O atributo de dados do evento de mensagem contém dados do trabalhador.
Exemplo.html: (página inicial):var myworker = novo trabalhador (my_task.js); ;
Nota: De um modo geral, tópicos de fundo -incluindo trabalhadores -unificáveis para operar o DOM. Se o encadeamento de segundo plano precisar modificar o DOM, ele deve enviar a mensagem ao seu fundador para que o Criador conclua essas operações.
Como você pode ver, a mensagem transmitida entre trabalhador e página inicial é sempre "mensagem JSON", mesmo que seja um tipo de valor original. Portanto, você pode transmitir dados JSON e/ou qualquer tipo de dados que possa serializar:
PostMessage ({cmd: init, timestamp: date.now ()});Exemplos para passar dados
Exemplo#1: Crie um "Assíncrono Eval ()" comum "
O exemplo a seguir introduz como usar o eval () no trabalhador para executar qualquer tipo de código JavaScript em qualquer tipo de assíncrono em ordem ::
// Sintaxe: assynceval (code [, listner]) var assínceval = (function () {var alistener = [], ocarser = new Worker (Data: text/javascript; charset = US-asciii, onmessage%20%3d 20function %20%28OEVENT%29%20%7B%0a%09PostMessage%28%7B%09%09%22id%22%20oEvent.data%2c%09%22Evaluado%22%3a 3a 3a 3a 3a 3a 3a 3a 3a 3a%% 20eval%28oEvent.Data.Code%29%0a%09%7d 29%3b%0a%7d); data.id] (eevent.data.valuado);} exclua alisteners [eevent.data.id];}; : Alisteners.length -1, código: scode});};});Exemplo de uso:
// Mensagem de alerta assíncrono ... assíncrealmente (3 + 2, função (smessage) {alert (3 + 2 = + smessage); // impressão assíncrona ... assíncada (// Olá, mundo !!!/,,, função (Shtml) {document.body.appendChild (document.createTextNode (shtml);}); .open (/get/, /http://www.mozilla.org//, false);/n/toreq.send (null);/n/tretrurn Oreq.Responsetext;/n}););););););););); );););););););););););););););););););));));););););)););Exemplo#2: Transfira o método avançado do JSON e crie um sistema de troca
Se você precisar transmitir dados muito complicados e precisar chamar vários métodos na página inicial e trabalhador ao mesmo tempo, considere criar um sistema semelhante ao seguinte.
Exemplo.html (a página principal): <! Argumento para passar 1, argumento para passar 2, etc. etc.): Chama a função consultável de um trabalhador * PostMessage (String ou JSON Data): consulte Worker.protodype. Função): Adiciona um ouvinte * Removelistener (Nome): Remove um ouvinte Propriedades: * DefaultListListener: O ouvinte padrão executou somente quando o trabalhador chama a função PostMessage () diretamente */ Função consultável (Surl, fdeflistener, FONERROR) {var vará Oinstance = this, oworcer = novo trabalhador (surl), olistener = {}; .Data.HasownProperty (rnb93qh) {olisteners [eevent.data.vo42t30] .apply (oievent.data.rnb99 3qh);} else {this.defaultListener.call (Oinstance, OEVENT.DATA); {owster.onerror = fonenerror;} this.sendQuery = function (/ * Nome da função consultável, argumento para passar 1, argumento para passar 2, 2, 2, etc. etc */) {if (argumentos.length <1) { Lançar novos typerror (consultas.SendQuery -não argumentos suficientes); = Function (vmsg) {// Eu acho que não há necessidade de usar Call () que tal apenas de (vmsg); Prototy Worker.Prototype.PostMessage.Call (Oworker, VMSG); ] = Flistener;}; ] * /); ); A ID = FirstLink href = javascript: omytask.sendQuery ('getDifference', 5, 3);> Qual é a diferença entre 5 e 3? omytask.sendQuery ('Waitsomething'); ) {// faça algo} funct} funct ion myPrivateFunc2 () {// faça algo} // etc. etc.// suas funções públicas personalizadas (ou seja, consultável na página principal) var? Obtenha a diferença a partir de dois nightrs: getDifference: function (nMinund, nsubtrahend) {Responder (printSomething, nMinuend -nSubtrahend);}, // Exemplo #2: aguarde três segundos Waitsomething: function () {Settimeout () tsomething, 3, sexo);}, 3000);}}; (/ * Nome do ouvinte, argumento para passar 1, argumento para passar 2, etc. etc */) {if (argumentos.length <1) {lança novo typerror (resposta -não : Argumentos [0], rnb93qh: array.prototype.slice .call (argumentos, 1)});} onMessage = function (oEvent) {if (eEvent.data Instância de objeto && SEWProperty) & DaeenPrty (bk4e1h0) .HasownProperty (kk4e1h0). {consulabiltableFunction [eEvent.data .bk4e1h0] .apply (self, oevent.data.ktp3fm1);} else {defaultQuery (eevent.data);}};Este é um método muito adequado para alternar as notícias entre a página inicial-trabalhador-ou o oposto-o oposto ao oposto.
Transferir dados transferindo a propriedade (objeto transferível)
O Google Chrome 17 e o Firefox 18 incluem outro método com um desempenho mais alto para passar o tipo específico de objeto (objeto transferível) para um trabalhador/volta do trabalhador. O objeto de transferência é transferido de um contexto para outro sem qualquer operação de cópia. Isso significa que terá uma ótima melhoria de desempenho ao passar o Big Data. Se você vier do mundo C/C ++, imagine -o como uma transmissão de acordo com a referência. No entanto, diferentemente do transporte de acordo com a referência, uma vez transferido o objeto, a versão que o contexto original não existirá mais. A propriedade do objeto é transferida para o novo contexto. Por exemplo, quando você transfere um objeto ArrayBuffer do aplicativo principal para o trabalhador, o ArrayBuffer original é limpo e não pode ser usado. O conteúdo que ele contém (completo) será passado para o contexto do trabalhador.
// Crie um arquivo de 32 MB e preencha -o.VAR UINT8ARRAY = NOVO UINT8ARAY (1024*1024*32); ;Gerar subworker
Se necessário, o trabalhador pode gerar mais trabalhadores. Isso é chamado de subworker, que deve hospedar na mesma fonte da página pai. Da mesma forma, o Subworker analisa o endereço do URI em vez de sua própria página em vez de sua própria página. Isso faz com que o trabalhador monitore facilmente sua dependência. O Chrome não suporta o subworker.
Trabalhador incorporadoAtualmente, não existe um método "oficial" que possa incorporar o código do trabalhador em uma página da web como o <Script> Elements. Mas se um elemento <Script> não tiver características de SRC e suas características de tipo não forem especificadas como um tipo MIME em execução, ele será considerado um elemento de bloco de dados e poderá ser usado pelo JavaScript. "Data Block" é um recurso muito comum no HTML5, que pode transportar quase qualquer tipo de dados do tipo de texto. Portanto, você pode incorporar um trabalhador da seguinte maneira:
<! Análise do motor, porque seu tipo MIME é o texto/JS-Work. Var myvar = Hello World!; </script> <script type = text/javascript> // O script será analisado pelo mecanismo JS porque seu tipo MIME é texto/javascript. Função pagelog (smsg) {// use fragmento: dessa maneira, o navegador só renderá/reorganizando. var ofragm = document.createDocumentFragment (); -Workr> // Este script não será analisado pelo mecanismo JS porque seu tipo MIME é o texto/trabalho JS. onMessage = função (OEvent) {PostMessage (MyVar);}; </script> <script type = text/javascript> // O script será analisado pelo mecanismo JS porque seu tipo MIME é texto/javascript. // No passado ...: // Usamos o BLOB Builder // ... mas agora usamos o BLOB ...: var blob = new Blob (Array.prototype.map.call (documens.QuelySelectory (Script [Type = =/text // js- workr/], function (oscript) {return Oscript.textContent;}), {type: text/javascript}); Script S-Worker. Document.Worker = New Worker (Window.url.CreateObjecturl (BLOB); () {document.worker.postMessage ();};Agora, o trabalhador incorporado foi definido em um documento personalizado.
Tempo limite e intervaloO trabalhador pode usar o tempo limite e o intervalo como o thread principal. Isso será muito útil, por exemplo, se você deseja que o thread do trabalhador seja periodicamente sem o código de execução ininterrupto.
Trabalhador de rescisãoSe você deseja rescindir um trabalhador imediatamente, pode ligar para o método de términato () do trabalhador ::
myworker.terminate ();
O tópico do trabalhador será morto imediatamente e não deixará nenhuma oportunidade de deixá -lo concluir sua própria operação ou trabalho de limpeza.
Os trabalhadores também podem chamar seu próprio método nsiworkerscope.close () para fechar a si mesmo:
self.close ();Erros de processo
Quando o trabalhador é erros de tempo de execução, sua função de processamento de eventos OnError é chamada. Ele recebe um evento que implementa o erro de nome da interface ErroEvent. O incidente não será borbulhante e pode ser cancelado; O evento de erro tem os três campos a seguir interessados::
MensagemMensagens de erro legíveis.
nome do arquivoNome do arquivo de script de erro.
LinenoO número da linha do arquivo de script quando ocorre um erro.
Visite o objeto NavigatorOs trabalhadores podem acessar objetos de navegador em seu escopo. Ele contém a string a seguir que pode reconhecer o navegador, como fazê -la em scripts comuns:
O thread do trabalhador pode acessar uma função global, ImportScripts (), que permite que o trabalhador introduza o script ou a biblioteca em seu próprio escopo. Você pode apresentar o URI sem passar os parâmetros ou o URI de vários scripts;
ImportScripts (); */
O navegador carrega e executa o script. Os objetos globais em cada script podem ser usados pelo trabalhador. Se o script não puder ser carregado, a exceção do Network_error será lançada e o próximo código não será executado. O código que foi executado anteriormente (incluindo o código executado usando window.setTimeout ()) ainda pode ser usado. A declaração de função após o importação de scripts () ainda pode ser usada porque eles estão sempre em execução antes de outro código. NOTA: A ordem de download do script não é corrigida, mas o pedido será passado para os importandscripts () () quando executado. Isso é concluído simultaneamente;
exemploEsta seção fornece vários exemplos de como usar o DOM Worker.
Executar operações em segundo plano
Uma das vantagens do trabalhador é que ele pode executar a operação densa do processador sem bloquear o thread da interface do usuário. No exemplo a seguir, o trabalhador é usado para calcular a fibona.
Código JavaScript
O código JavaScript a seguir é armazenado no arquivo "fibonacci.js", que está associado ao arquivo HTML na próxima seção.
Var Resultados = []; função errorreceiver (event) {throw event.data;} onmessage = function (event) {var n = parseint (event.data); } Para (var i = 1; i <= 2; i ++) {var trabalhador = novo trabalhador (fibonacci.js);O trabalhador define o atributo onMessage para uma função. (Observe que esse uso não é o mesmo que definir uma variável global com o mesmo nome ou uma função do mesmo nome. a mensagem enviada pela página da web.) Isso permitirá a recursão e gerará sua nova cópia para processar cada ciclo de cálculo.
Código HTML
<! = novo trabalhador (Fibonacci.js); = função (erro) {dump (erro do trabalhador: + erro.Message +/n);A página da web cria um elemento div, o ID é resultado, usando -o para exibir o resultado do cálculo e, em seguida, gerar um trabalhador. Após gerar um trabalhador, a função de processamento de onMessage é configurada para exibir os resultados do cálculo, definindo o conteúdo do elemento DIV e, em seguida, a função de processamento do ONERROR é definida como as informações de erro de armazenamento. Por fim, envie uma mensagem ao trabalhador para iniciá -la.