Use A Cabeça! Programação Em HTML5

este é um novo capítulo 473

10

pondo o javascript para funcionar

Web Workers

Script lento — você quer continuar executando-o? Se

você já gastou tempo suficiente com o JavaScript ou pesquisando na web,

provavelmente já viu a mensagem “script lento” (slow script). Com todos

esses processadores multi núcleo fazendo parte da sua máquina novinha,

como pode um script estar rodando tão lentamente? Isso acontece porque o

JavaScript só pode fazer uma coisa por vez. Contudo, com o HTML5 e os Web

Workers, tudo isso muda. Você agora tem a habilidade de gerar seus próprios

trabalhadores JavaScript para obter maior volume de trabalho feito. Se estiver

apenas tentando desenhar um aplicativo mais responsivo, ou só quiser exigir o

máximo que o CPU de sua máquina pode trabalhar, os Web Workers estão aqui

para ajudar. Ponha seu chapéu de gerente JavaScript e vamos pôr alguns peões

para trabalhar!

Ok, não posso fazer

TUDO por aqui! Vou

precisar de alguma

ajuda.

Que tal uma

ajuda lá dentro do

poço do elevador?

(os Trabalhadores da Web)

PFCG_HeadFirstHTML5Prog.indb 473 05/06/2014 16:21:19

threads de javascript

474

Capítulo 10

O terrível script lento

Uma das coisas mais incríveis sobre o JavaScript é que ele

faz só uma coisa por vez. É o que gostamos de chamar de

“single-thread”. Por que isso é incrível? Porque faz

a programação de forma direta. Quando você tem

vários threads de execução acontecendo ao mesmo

tempo, escrever um programa que funcione

corretamente pode se tornar um desafio e tanto.

O lado negativo de ser single-thread é que, se

você der muita coisa para fazer a um programa

JavaScript, ele pode ficar sobrecarregado e

acabamos tendo diálogos “slow script”. A outra

consequência de ter apenas um thread é que, se tiver um

código JavaScript que estiver trabalhando muito, ele não

deixa muita força computacional para a interface de seu

usuário ou para as interações do usuário, e seu aplicativo

pode parecer meio molenga ou não-responsivo.

Como o JavaScript gasta seu tempo

Vejamos o que tudo isso significa, dando uma olhada em como

o JavaScript manipula as tarefas de uma página típica:

Há apenas um de mim,

mas veja tudo que faço

manipulando tudo isso,

uma coisa por vez.

É isto o que

chamamos de

single-thread.

O JavaScript

analisa cada coisa

que precisa fazer,

uma após a outra.

Não há qualquer

execução paralela

acontecendo.

Para muitos aplicativos web

isso funciona perfeitamente.

Tudo fica pronto e a

interface do usuário parece

rápida e responsiva.

faz só uma coisa por vez. É o que gostamos de chamar de

vários threads de execução acontecendo ao mesmo

faz só uma coisa por vez. É o que gostamos de chamar de

Rodar uma função init

Manipular um clique de usuário

Um timer acabou de disparar

Manipular um submit

Processar um array de dados

Manipular outro clique de usuário

Atualizar o DOM

Buscar dados de formulário

Validar input de usuário

Thread do

JavaScript

PFCG_HeadFirstHTML5Prog.indb 474 05/06/2014 16:21:21

pondo o javascript para trabalhar

você está aqui 

475

Processar um array de dados

Atualizar o DOM

Buscar formulários de dados

Manipular outro clique de usuário

Validar esse input

chug

chug

chug

chug

chug

whirrr

whirrr

whirrr

Rodar uma função init

Manipular um clique de usuário

Um timer que dispara

Enviando um submit

JavaScript

Thread

Putz! Processar um grande

array leva muito tempo!

O que está havendo lá para

cima? As coisas não estão

sendo feitas!

Quem está se

apoderando do tempo

de processamento?

Os usuários estão caindo

fora! O UI não está

sendo atualizado!

Nós desistimos, jogamos

a toalha, traga a caixa de

diálogo slow script.

Quando o single-thread fica RUIM

É verdade que, para muitos usos, este modo single-thread de computar do JavaScript

funciona perfeitamente e, como dissemos, torna a programação bem direta. Quando se

escreve código, porém isso se torna tão “computacionalmente intensivo” que começa a

criar impacto na habilidade do JavaScript de lidar com tanto trabalho; o modelo single-

-thread começa a entrar em colapso.

Vai tudo indo

bem até que um

pouco de código

JavaScript

começa a requerer

muito tempo de

processamento,

tirando o trabalho

de interação

do JavaScript

com o usuário, na

interface dele.

PFCG_HeadFirstHTML5Prog.indb 475 05/06/2014 16:21:22