Feb 26 2008

Como funcionam os timers no Javascript

Tag: Javascriptdavid @ 11:35 am

John Resig (JQuery/Mozilla) postou um artigo muito interessante no seu blog sobre como funcionam os timers em Javascript, vale a pena dar uma olhada porque é uma descrição muito mais detalhada do que a que presente no livro “Javascript - The Definitive Guide”(14.1 - Timers) , a bíblia a programação client-side. O texto é uma amostra do conteúdo do livro “Secrets of Javascript Ninja”, ainda não lançado.

Em um nível fundamental é importante entender como os timers funcionam em Javascript. Frequentemente eles se comportam de maneira não muito intuitiva por estarem todos em uma única thread. Vamos examinar as três funções para construir e manipular timers:

  • var id = setTimeout(fn, delay); - Inicia um timer simples que vai invocar a função depois do intervalo especificado. A função retorna um ID único que pode ser usado para cancelar o timer.
  • var id = setInterval(fn, delay); - Similar a setTimeout mas continua invocando a função aplicando o mesmo intervalo (delay) até ser cancelada.
  • clearInterval(id);, clearTimeout(id); - Aceita um timer ID (o retorno das funções anteriores) e interrompe a execução do timer

Para entender melhor como os timers funcionam internamente existe um conceito importante a ser explorado: O delay não é garantido, o problema é que o Javascript no browser é executado em uma única thread, o que força todos os eventos assíncronos (clicks de mouse e timers) a rodarem apenas quando ouver uma “janela” de processamento. Isso é melhor demonstrado em forma de diagrama:

427px-timers.png

Apesar do nome esdrúxulo parece que esse livro vai ser mais interessante que o primeiro, “Pro JavaScript Techniques”, que eu achei muito fraco (bem aquém das minhas expectativas por ser um livro do criador da JQuery).

O artigo original está no endereço http://ejohn.org/blog/how-javascript-timers-work/