10/05/2012 Development / java script

Um exemplozinho mais prático para mostrar como funciona web worker, as novas threads em javascript.

Quer experimentar: Execute um loop muito grande e verá que o navegador trava até o loop ser finalizado:
var result = 0;
 
for ( var x = 0; x < 10000000; x++){
result++
}
 
alert( result );

E como resolver se preciso de um loop extenso ou qualquer outro item que esteja travando a interface?
Existem algumas técnicas para amenisar esse travamento utilizando setTimeout ou setInterval mas isso não vem ao caso pois a noite é da estrela Web Worker.
Aí você me pergunta: Mas então o que é Web Worker e o que ele faz?

var worker = new Worker( 'path/to/script.js' );
 
worker.addEventListener('message', function(e){
alert( e.data );
}, false );
 
worker.postMessage(); // Inicia o worker

Script.js

this.addEventListener('message',function( e ){
 
var result = 0;
 
for ( var x = 0; x < 10000000; x++){
result++
}
 
this.postMessage( result );
 
this.close();
 
}, false );

Para testar clique aqui - http://alantavares.com.br/exemplos/javascript/webworker/

Post reaproveitado de http://alantavares.com.br/

Espero que sirva!