우리는 고려 requestAnimFrame 은'수익'을 응용 프로그램을 반복하도록 허용 이벤트 루프를 처?

Question

내가 사용하는 requestAnimFrame 방법 에서 자바스크립트를 만들이 캔버스 업데이트 내 프로그램의 메인 루프:

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");
//    }
}

무슨 일이 일어나고 있었는 내 프로그램입 업데이트 캔버스 후 나의 주요한 루프를 실행했다 100 반복한 다음 중지되었습니다.후에 추가 위의 방법으로 나의 주요한 반복,갑자기 나를 얻을 캔버스트 모든 루프의 내 프로그램입니다.

캔버스지 않을 얻을 때까지 업데이트 내 프로그램을 완성했다 나를 생각하게 만드는 캔버스로 업데이트를 실행되었다 다른 스레드에는 우선 순위입니다.(그러나 우리가 알고 있는 자바 스크립트는 하나의 스레드).

나의 질문입니다- 우리는 고려 requestAnimFrame 은'수익'을 응용 프로그램을 반복하도록 허용 이벤트 루프를 처? 할 수 있다고 가정 자바 스크립트는 하나의 스레드?

Answer 1

당신은 특정하지 않는 방법에 대해 당신은 당신의 반복 1000 시간을,그러나 나는 가정 뜻을 반복 사용 for 나 while 루프(?올바른의 경우..).

을 수행할 때 대한/하는 동안 반복 스크립트 바쁜 것-반복될 때까지 반복되는(또는 범위)가 완료되었습니다.로 JS 은 당신이 알고 하나의 스레드 그것은 처리할 수 없는 것과 같은 이벤트 큐는 동안 그것은 이 일을 그 때문에 아무것도 할 수있을 것입 업데이트(incl.DOM)까지 루프가 완료되면(일반적으로 말하자면 수있다,특정 브라우저 구현하는 것을 허용하십시오 DOM 업데이트하는 경우 DOM 업데이트를 실행되는 별도의 스레드에서 예를 들어 하지만 이것은 별도의 것에 JS).

이제는 당신이 구현되는 rAF 당신이 일을 하나의 반복당 프레임.즉,브라우저는 시간 프로세스 이벤트 큐 비동기적으로 (동일하지 않으로 멀티-스레드)지 않는 코드에서 처리되는 반복았다 또한 바쁜-반복한 것 만들기 같은 시나리오으로 첫 번째입니다.

당신이 사용할 수 있는 setTimeout 뿐만 아니라.What rAF 다르게 할 이상 예를 들어 setTimeout 나 setInterval 는 효율적인 낮은 수준의 구현 타이머의 메커니즘을 수 있을 동기화하 모니터 VBLANK 기(수직 블랭킹 비디오 카드 노예해라는 옵션 vsync)-의미에서 일반 word 모니터율(일반적으로 60Hz).이를 만들 수 있도록 부드러운(er)애니메이션과 그 때문이라고 요청*애니메이션*프레임으로,이것은 주로 만들었습니다.

JS 여전히 하나의 스레드?예,이 변경되지 않는다(를 달성 할 수있는 유일한 방법은 멀티-스레딩에서 JS 를 사용하여 웹자).

하 rAF 변?지 않는 이 지역에서-그것은 더 정확하고 성능의 대안 setTimeout 고 그것은 동기화가 다르게 하지만 그 모든.그것이 고통과 같은 제한을 가진 setTimeout 할 수 있지 않을 트리거하는 경우 이 범위는 바쁜(라 request*이름의 일부 의미하는 보장이 없)그러나 그 때 그것을 트리거 될 것과 동기화 모니터 재생 속도.