Nuestro equipo de trabajo ha pasado horas buscando para dar soluciones a tus preguntas, te brindamos la soluciones así que esperamos serte de mucha apoyo.
Solución:
En realidad, no se debe a ningún almacenamiento en búfer doble que no vea los resultados, sino a que JavaScript en el navegador web es de un solo subproceso. Si crea de manera similar un solo bucle en JavaScript que repetidamente hace algo como myDiv.style.top = parseInt(myDiv.style.top) + 1 +"px"; verá que nada cambiará visiblemente en el navegador, incluso durante muchos segundos, hasta que su JavaScript haya terminado de ejecutarse.
Para dibujar cambios y ver los resultados en la pantalla, debe usar setInterval o setTimeout para devolver el control al navegador pero solicitar ejecutar el código en algún momento en el futuro.
Por ejemplo, para dibujar un nuevo rectángulo aleatorio de colores aleatorios en el lienzo 15 veces por segundo:
var canvas = document.getElementsByTagName('canvas')[0];
var ctx = canvas.getContext('2d');
setInterval(function()
ctx.clearRect(0,0,canvas.width,canvas.height);
var r=Math.random()*255, g=Math.random()*255, b=Math.random()*255;
ctx.fillStyle = 'rgb('+r+','+g+','+b+')';
var w=Math.random()*canvas.width, h=Math.random()*canvas.height;
var x=Math.random()*(canvas.width-w), y=Math.random()*(canvas.height-h);
ctx.fillRect(x,y,w,h);
,1000/15);
Más adelante puedes encontrar las crónicas de otros desarrolladores, tú de igual forma puedes dejar el tuyo si te apetece.