2012-05-25 7 views
2

자바 스크립트에서 프레임 속도 카운터로 인해 예기치 않은 결과가있는 것 같습니다. 최근까지 카운터가 괜찮 았고 30fps로 작은 js 앱을 돌리고있었습니다.자바 스크립트 setTimeout 및 프레임 속도

setTimeout()을 사용합니다 (시스템이 떨어지는 것을 막기 위해 시간을 조정 함).

window.requestAnimFrame = (function() 
{ 
    return function (callback) { 
     time += FPS; 
     Heartbeat._eTime = (new Date().getTime() - Heartbeat._start); 
     var diff = Heartbeat._eTime - time; 

     Heartbeat._delta = FPS - diff; 
     Heartbeat._deltaS = Heartbeat._delta/1000; 

     window.setTimeout(callback, FPS - diff); 
    }; 
})(); 

하트 비트는 프레임 속도 정보가 포함 된 개체 일뿐입니다.

* 여기 내 문제 : *

_MainLoopHandler: function() { 

    timer = new Date().getTime(); 
    counter = timer; 

    while (this._messages.length > 0 && (counter - timer) < 5) 
    { 
     // process messages from _messages array 
    } 

    counter = new Date().getTime(); 
    // THE ABOVE IS HAPPY AT 30 FPS 


    while ((counter - timer) < 6) { 
     1 + 1; 
    } 
    // THE ABOVE WHILE IS VERY UNHAPPY :(

} 

그래서 위의 코드 블록에서는 setTimeout 모든 33.33 밀리 초 (초당 30 프레임)에서 호출되는 함수입니다. 루프를 끝내면서 바닥을 찍으면 FPS 카운터가 30fps로 행복하게 앉아있을 것입니다. 그러나, 내가 그것을 맡기면, FPS 카운터는 미쳐 간다. 200FPS 300FPS까지 올라간 다음 갑자기 -200FPS -10FPS 0.01FPS가됩니다. 벽에서 완전히 벗어났습니다. while 루프는 "프레임"당 10 번만 실행됩니다.

또한 하드 코딩 된 값 5와 6은 단순히 루프 처리 중 (로드 균형 조정을 위해) 5 밀리 초 또는 6 밀리 초가지나 갔는지 확인하는 것입니다.

이것은 단순히 자바 스크립트가 정보량을 처리 할 수 ​​없거나 다른 누구에게도 비슷한 문제가 있었습니까?

감사합니다.

답변

0

나는 실제로 어떤 일이 일어나는지 모르지만, 로컬 변수를 사용하여 시간을 제어하고, 항상 counter을 재평가하고 한 번에 1 개의 메시지를 처리해야한다고 생각합니다. 코드를 간소화

_MainLoopHandler: function() { 

    var start = new Date().getTime(); 
    var current; 

    do { 
    if (this._messages.length === 0) break; 
    // process 1 message 
    current = new Date().getTime(); 
    } while (current - start < 5); 

} 

당신은 또한 (도시하지 않음) 객체의 타이밍 우려를 캡슐화 할 수 있습니다 : 또한, 나는 정말 마지막 루프 (나는 또한 변수의 이름을 변경) 이해하지 못하는

_MainLoopHandler: function() { 

    var timing = new Timing(); 

    do { 
    if (this._messages.length === 0) break; 
    // process 1 message 
    } while (timing.elapsed() < 5); 

} 
+0

마지막 루프는 "할 일"예제였습니다. 업데이트 된 코드에서는 SVG 노드의 스트리밍을 노드별로 처리합니다 (각 루프의 SVG 비트 만 빌드합니다). 아무리해도 문제를 발견하지 못했고 프레임 속도 카운터를 생성하는 방법과 관련이있었습니다. –

+0

그러나 위의 코드가 내가 가진 것보다 낫습니다. 그래서 대신 그 코드를 작성했습니다! –

관련 문제