84669인 학습
152542인 학습
20005인 학습
5487인 학습
7821인 학습
359900인 학습
3350인 학습
180660인 학습
48569인 학습
18603인 학습
40936인 학습
1549인 학습
1183인 학습
32909인 학습
캔버스에 애니메이션을 구현하고 싶습니다. 애니메이션의 각 프레임을 Sprite에 그려서 하나의 그림으로 연결합니다. 애니메이션을 구현하기 위해 setTimeout을 사용해 보았지만, requestAnimationFrame에서는 프레임 속도를 제어할 수 없습니다. 1초에 7프레임을 그리려면 어떻게 해야 하나요?
requestAnimationFrame은 브라우저가 다음 프레임을 렌더링할 때 호출되므로 requestAnimationFrame의 호출 속도는 브라우저의 새로 고침 빈도(일반적으로 60프레임)라고 간주할 수 있습니다
그러나 requestAnimationFrame이 콜백을 호출하면 타임스탬프 매개변수가 전달됩니다. 이 매개변수를 기반으로 판단하여 실제로 필요한 프레임 속도를 처리할 수 있습니다
예를 들어 초당 7프레임을 원한다면 이렇게 쓰면 됩니다
제어할 수 없는 것 같지만 브라우저가 스스로 계산합니다
1s7 프레임의 새로 고침 빈도는...본질적으로 "프레임 건너뛰기" 효과입니다...
requestAnimationFrame은 브라우저가 다음 프레임을 렌더링할 때 호출되므로 requestAnimationFrame의 호출 속도는 브라우저의 새로 고침 빈도(일반적으로 60프레임)라고 간주할 수 있습니다
그러나 requestAnimationFrame이 콜백을 호출하면 타임스탬프 매개변수가 전달됩니다. 이 매개변수를 기반으로 판단하여 실제로 필요한 프레임 속도를 처리할 수 있습니다
예를 들어 초당 7프레임을 원한다면 이렇게 쓰면 됩니다
으아아아제어할 수 없는 것 같지만 브라우저가 스스로 계산합니다
1s7 프레임의 새로 고침 빈도는...본질적으로 "프레임 건너뛰기" 효과입니다...