초당 간단한 프레임 속도 애니메이션 벤치 마크 자바 스크립트 유틸리티를 작성하려고합니다. FPS는 아마도 여기있는 용어 일 뿐이지 만 브라우저와 장치간에 다른 애니메이션 (CSS3/canvas/webgl)이 어떻게 수행되는지를 더 정확하게 비교하고 측정 할 수있는 것이 이상적입니다. (그래서 특정 코드를 테스트하는 것이 아니라 페이지에 포함되어 있으며 자체적으로 할 수있는 JS 라이브러리)웹 기반 애니메이션을위한 벤치마킹 FPS?
그리고 주제에 가장 잘 접근하는 방법에 대한 아이디어를 찾고 있습니다.
예를 들어 requestAnimationFrame이 내가 찾고있는 바입니다. 조금만 읽고 있는데 브라우저가 다시 그리기/애니메이션 작업을 할 때마다 호출되는 것 같습니다. 그래서 (같은 애니메이션을 실행하는 경우) 같은 논리에 의해 브라우저는 빈번한 빈번한 실행처럼 빈번하게 사용 가능하지 않습니다 - 우리는 이미 우리가 다시 비교할 수있는 숫자를 이미 가지고 있습니다.
물론 requestAnimationFrame은 내가 (특히 모바일에서) 원하는대로 광범위하게 지원되지 않습니다. 어떻게해서 setInterval을 사용할 수 있습니까? 나는 그것을 신뢰할 수는 없지만 그것이 내 장점에 익숙 할 수도 있다는 것을 이해합니다. 예를 들어, 초당 1000 회 호출 한 다음 초당 실제로 실행 된 횟수를 비교하면 - 그것은 이미 일종의 벤치 마크입니다.
여기있는 유일한 문제는 해당 메서드가 애니메이션뿐만 아니라 모든 문제에 대한 측정을 제공한다는 것입니다. 예를 들어 DOM에서 뭔가를하고 있기 때문에 브라우저가 간격을 건너 뛰는 것을 상상할 수 있습니다. 브라우저가 단일 프로세스 동물이므로 DOM 변경이 애니메이션에도 영향을 미친다 고 주장하지만, CSS3 애니메이션이 GPU 하드웨어 가속화 인 경우에도 여전히 그렇습니다.
지금은 단지 이론 일뿐입니다. 그래서 어떤 아이디어라도 높이 평가됩니다! ;-)