Web Workers - Threads em Javascript

No final do mês passado eu coloquei aqui no blog uma nota sobre o lançamento do Firefox 3.5 e as novidades trazidas por essa versão.

Fiz uma leitura mais aprofundada nos textos e vi um recurso bastante interessante chamado Web Workers. Segundo a descrição do MDC, os Web Workers permitem a execução de códigos de forma multi-thread dentro de aplicações web e sites.

Quem escreve código Javascript hoje em dia sabe que não é raro o navegador "congelar" durante um código que exige um pouco mais de processamento. Existem algumas formas de evitar esse "congelamento" sim... mas certamente os Web Workers elevam a resolução deste problema a outro nível de soluções e possibilidades. :D

Com os Web Workers você pode iniciar um código que será executado em paralelo ao código Javascript da sua página. Esse código executado pelo "worker" trabalha num ambiente diferente, sem acesso à página pai e, principalmente, sem acesso ao DOM. A única forma de comunicação entre a página pai e um processo "worker" se dá através de mensagens.

Como eu estava interessado em verificar se esses Web Workers realmente trabalham em paralelo :) , fiz uma página que faz esse teste. Nela, há duas versões de um mesmo código que calcula a sequência (ou número) de Fibonacci. Além disso, na página há uma animação com jQuery rodando, o que vai permitir perceber claramente se o navegador vai ou não "congelar".

Veja aqui o teste com Web Workers. (para o Firefox só funciona na versão 3.5)

Como você pode ver pelo teste acima, realmente o código roda em background, sem afetar a página renderizada.

Vale ressaltar que nos testes eu exibo também o tempo em milissegundos que a operação levou. Fazendo os testes aqui no meu computador, a versão com Web Workers leva em média 1600 ms, enquanto a versão "normal" leva em média 800 ms. O dobro de tempo mas é algo a se ponderar se lembrarmos que a versão "normal" trava totalmente o navegador enquanto o cálculo é feito. (interessante... rodando o teste local, a versão com "worker" executa bem mais rápido do que a versão online aqui no blog, talvez pelo tempo de download do "worker.js"?)

Update: na versão do código de testes que eu fiz ontem, ao clicar no botão para calcular o número de Fibonacci, o código do "worker.js" era baixado antes do cálculo em si ser executado. Isso causava uma grande diferença entre o teste rodando local e o teste rodando online (óbvio hehe). Fiz uma modificação hoje para deixar o "worker.js" já carregado (assim como os demais arquivos ".js").

E como comentário final: tentei deixar os códigos tão similares quanto possível para não afetar significativamente os resultados em favor de uma ou outra forma de cálculo. Sugestões e/ou correções são bem-vindas. :)

Referências
developer.mozilla.org: Using web workers
hacks.mozilla.org: using web workers: working smarter, not harder
ejohn.org: Computing with JavaScript Web Workers

comentários (2)

Firefox, Chrome, Internet Explorer, Opera... Ótimo!

Montagem com os logos do Firefox, Internet Explorer, Opera e Chrome - Todos os direitos reservados aos seus devidos autores

Claro, depende do ponto de vista. =) Mas em termos gerais eu acredito que essa nova edição da "guerra dos browsers" é muito bem-vinda e benéfica.

Como interfaces do sistema operacional do futuro, penso que quanto mais os navegadores evoluírem, melhor. E nada melhor que concorrência para estimular o desenvolvimento e a inovação desse tipo de aplicativo.

Com o lançamento do Google Chrome, uma tema bastante interessante (ao menos pra mim) passou a ser mais discutido: performance de Javascript. Quem desenvolve interfaces web hoje sabe que não raro são as vezes em que você acaba com o navegador bastante lento quando faz operações com os elementos (DOM) existentes na tela, isso pra citar apenas um dos casos.

E o que mais me deixa positivo sobre esse fato é: até a Microsoft está preocupada em melhorar o Internet Explorer 8 para não ficar em desvantagem nessa guerra dos browsers.

Com browsers melhores, mais rápidos e mais ricos em termos de recursos, haverá toda uma nova gama de possibilidades para desenvolvimento web. E vale dizer que isso não é bom só para nós, desenvolvedores, mas também para os usuários de Internet como um todo, que terão aplicações mais ricas, mais rápidas e mais úteis, tudo "independente" da plataforma do sistema operacional.

E enquanto a guerra dos browsers se mantiver dentro dos moldes atuais, pode ter certeza, só temos a ganhar. =)

comentários (4)

Último dia da oficina de Javascript e Ajax

A oficina de Ajax que começou no dia 1 deste mês acabou hoje, dia 17. Nestes vários dias de curso/oficina deu pra abordar vários temas, desde os fundamentais para o bom entendimento da linguagem até o uso prático e produtivo do Javascript.

Durante esse período mostrei desde a sintaxe base da linguagem, passando por manipulação de CSS e DOM, eventos e listeners, até chegar no tão falado Ajax. E no último dia ainda deu tempo de apresentar a ótima biblioteca jQuery sob o tópico produtividade.

Ah, tirei uma foto com o pessoal que participou da oficina:

Na foto estão os alunos da oficina e eu, quase no centro, de camisa azul.

Espero que todos possam ter aprendido pelo menos algo de novo e interessante. Aproveito para agradecer a presença de todos, que se esforçaram pra acordar cedo mesmo durante as férias letivas. Bom, agora deixa eu mostrar a foto para minha mãe... =)

Gostei de ministrar essas oficinas, e já estou até pensando qual pode ser o tema da oficina de verão, no final do ano? LAMP? Ruby on Rails? Só o tempo dirá... :D

comentários (4)