Canvas 2D 렌더링 루프는 상태를 다시 그린다
Canvas 애니메이션은 이전 그림을 수정하는 것이 아니라 현재 모델 상태를 기준으로 픽셀 버퍼를 반복해서 갱신한다.
| 루프 단계 | 하는 일 | 대표 API | 위험 신호 |
|---|---|---|---|
| measure | CSS 크기와 DPR 반영 | canvas.width, scale | 레티나 화면에서 흐림 |
| clear | 이전 프레임 제거 | clearRect | 잔상이 남음 |
| draw | 현재 모델을 순서대로 출력 | path, text, image | state 초기화 누락 |
| schedule | 다음 프레임 예약 | requestAnimationFrame | setInterval로 프레임 튐 |
Canvas는 화면에 남은 그림보다 별도로 관리하는 모델 상태가 진짜 원본이다.