Comprensión de los problemas del hilo del temporizador de JavaScript

Question

Estoy comenzando con un MMORPG de JavaScript que realmente funcionará sin problemas. Actualmente, creé una demostración para demostrar que puedo mover a los personajes y hacer que chateen entre ellos, así como ver cómo se mueven en vivo.

http://set.rentfox.net/

temporizadores Ahora Javascript son algo que no he utilizado mucho, pero por lo que sé, me corrija si estoy equivocado, es que el tener múltiples setIntervals que suceden al mismo tiempo, no funciona muy bien también b/c está todo en un solo hilo.

Digamos que quería tener a 10 personas disparando bolas de fuego contra un monstruo usando el posicionamiento de fondo de sprite con setInterval - esa animación requeriría 10 setIntervals repintando el DOM para cambios de posición de fondo de sprites. ¿No sería eso un gran buggy?

Me preguntaba si había una forma de evitar todo esto, tal vez usando Canvas, de modo que todas las animaciones pueden suceder al mismo tiempo sin crear una cola de eventos y no tengo que preocuparme por los temporizadores.

Espero que tenga sentido, y por favor avíseme si necesito aclarar más.

Answer 1

El problema con múltiples setInterval s es doble. El primero es como usted indica, dado que todo el Javascript en los navegadores es (actualmente) de un solo subproceso, la ejecución de un temporizador puede retrasar la ejecución del próximo temporizador. (Worker threads están llegando, Firefox already has them, al igual que Safari 4 [y tal vez otros].) El segundo es que el temporizador ocurre en un intervalo establecido, pero si su controlador todavía se está ejecutando cuando ese intervalo expira, el segundo intervalo es completamente salteado Por ejemplo, el temporizador puede interferir consigo mismo.

Esa última parte necesita más explicación: Supongamos que tiene un setInterval de 10ms (que es el más rápido que puede razonablemente esperar que una implementación lo haga; puede bloquearse para que no vaya más rápido que eso). Si su controlador toma 13 ms, el intervalo que debería haber sucedido 10 ms después de comenzar se omitirá por completo.

Normalmente uso setTimeout para este tipo de cosas. Cuando se activa mi controlador, hago mi trabajo y luego programo el próximo evento al final del controlador. Entonces (dentro de los límites de lo que puede estar seguro de), sé que el próximo evento ocurrirá en ese intervalo.

Por lo que estás haciendo, parece que un solo temporizador de "pulso" sería lo mejor, trabajando en lo que sea que necesite hacer en el pulso. Si ese temporizador de pulso usa setInterval o setTimeout es una decisión basada en lo que está viendo con su código real.

Answer 2

+1 a T. J. Crowder, la respuesta fue perfecta. Recomiendo aprender a utilizar Canvas sobre nodos DOM para animación de juegos; este último es lento y con errores, y colgará el navegador en cualquier situación no trivial. OTOH, Canvas es mucho más rápido y puede ser acelerado por hardware, e incluso tiene un contexto 3D si lo necesita.