Podemos considerar un requestAnimFrame un 'rendimiento' en la aplicación de bucle para permitir que el bucle de eventos para el proceso?

Question

Estoy usando el requestAnimFrame método en JavaScript para hacer mi lienzo actualización dentro de mi programa del bucle principal:

window.requestAnimFrame = (function(callback) {
  return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
    function(callback) {
      window.setTimeout(callback, 1000 / 60);
    };
})();


function animate() {
    requestAnimationFrame( animate );
//var runcount = 100;
//for (var i=0;i<=100;i++) {
    draw();
//    if (runcount === i)
//        alert("Completed program loop");
//    }
}

Lo que ocurre es que mi programa que solo se actualiza el lienzo después de mi bucle principal se había quedado por 100 iteraciones y luego se detuvo.Después de agregar el método de arriba en mi bucle principal, de repente llego lienzo actualizaciones en cada bucle de mi programa.

El hecho de que el lienzo no se actualiza hasta que mi programa había terminado, me hizo pensar en que el lienzo de actualización se ejecuta en un subproceso diferente que no tienen prioridad.(Pero sabemos que JavaScript es un único subproceso).

Mi pregunta es - Podemos considerar un requestAnimFrame un 'rendimiento' en la aplicación de bucle para permitir que el bucle de eventos para el proceso? Puedo asumir que JavaScript es de un solo subproceso?

Answer 1

Que no son específicas acerca de cómo usted hizo su iteración 1000 veces, pero voy a asumir que usted significa que usted itera mediante un for o while bucle (?me corrija si estoy equivocado..).

Cuando haces un for/while el guión será ocupado-bucle hasta que el lazo (o alcance) ha completado.Como JS como usted sabe, de un único subproceso no puede procesar las cosas tales como la cola de eventos mientras está haciendo esto - para ello nada será capaz de actualizar (incl.DOM), hasta que el bucle ha terminado (generalmente hablando, no puede ser el navegador de aplicación específicos que permiten DOM actualizaciones si DOM actualizaciones se ejecutan en un hilo separado, por ejemplo, pero esto es una cosa distinta del JS).

Ahora que se ha implementado rAF usted está haciendo una sola iteración por marco.Esto significa que el navegador tiene tiempo para procesar la cola de eventos de forma asincrónica (no es el mismo multi-hilo), a menos que el código que se procesan en el bucle también se hizo ocupado-bucle por un tiempo que iba a crear el mismo escenario que el de la primera.

Usted podría haber utilizado setTimeout así.Lo de la rAF hacer de manera diferente que, por ejemplo, setTimeout o setInterval es que es una eficiente implementación de bajo nivel de un temporizador mecanismo capaz de sincronizar a la del monitor VBLANK período (vertical, con la supresión de la tarjeta de vídeo de esclavos a través de una opción que se llama vsync) - es decir, en formato de word a la frecuencia de actualización del monitor (normalmente 60 Hz).Esto nos permite crear liso(re) animación y es por eso que se llama solicitud*Animación*Marco como este es lo que es principalmente hecho para.

Es JS todavía de un único subproceso?Sí, esto no va a cambiar (la única manera de lograr multi-threading en JS es el uso de los Web workers).

Hacer de la rAF cambiar nada?No en esta zona, es más precisa y eficiente alternativa a setTimeout y se sincroniza de manera diferente, pero eso es todo.Va a sufrir las mismas restricciones que con setTimeout no ser capaz de desencadenar si de un ámbito que está ocupado (de ahí el request* la parte del nombre que no implica ninguna garantía) pero cuando se hacen desencadenar va a estar en sincronía con la frecuencia de actualización del monitor.