C.W.K.
Stream
Lesson 03 of 05 · published

anchored 클럭 하나가 jitter 를 죽여

~13 min · shared-clock, web-audio, scheduler

Level 0식은 재
0 XP0/33 lessons0/12 achievements
0/100 XP to next level100 XP to go0% complete
"voice 마다 자기 타이머를 주면 표류해. 클럭 하나를 주면 맞물려."

증상: 표류

v1 playback 엔진에서 solo, 코드, 메트로놈은 각각 맞는 음악적 순간에 울려야 해. 순진한 빌드는 각자 자기 타이머를 줘 — 그리고 천천히 미끄러져 갈라져, 독립 타이머가 독립 오차를 쌓으니까. 메트로놈이 머리카락만큼 일찍 치고, 코드가 늦고, 맞물려야 할 게 헐겁게 느껴져. 그게 jitter 고, 연습 도구의 죽음이야: 가만있지 않는 것에 맞춰 칠 수 없잖아.

수정: anchored 오디오 클럭 하나

수정은 단일 진실원이야 — 시간 의. anchor 하나를 골라(오디오-시간과 소스-시간이 함께 핀 박히는 순간), 모든 voice 의 소스 위치를 같은 함수로 오디오-시간에 매핑해. 귀로 정렬을 미세조정할 syncOffset knob 을 더해. 그다음 lookahead scheduler 를 돌려: 짧은 간격으로 깨어나, 다음 window 안에 도래하는 모든 걸 AudioContext 자기 클럭에 맞춰 스케줄해 — 절대 setTimeout 에 맞추지 마, 음악적 타이밍엔 너무 jitter 가 심하거든. 모든 voice 가 그 클럭 하나를 읽으니까, 물리적으로 갈라질 수 없어.

one-model 아이디어를, 시간에 적용

모양을 봐: 이건 정확히 Track 3 의 단일 진실원이 다른 모자를 쓴 거야. 거기선 음악 모델 하나와 의견 못 갈리는 view 여럿. 여기선 timebase 하나와 표류 못 하는 voice 여럿. 같은 원칙 — 모든 게 파생되는 단일 권위 소스 — 이 fragment 되는 게 데이터(모델)든 시간(클럭)이든 fragmentation 을 풀어. 표류를 보면, 빠진 단일 소스를 찾아.

Code

클럭 하나, voice 여럿 — anchored 오디오 timebase·javascript
// anchored 클럭 하나. 모든 voice 가 source-time -> audio-time 을
// SAME 함수로 매핑해서, 물리적으로 갈라질 수 없어.
function audioTimeOf(srcTime) {
  return anchorAudio + (srcTime - anchorSrc) / tempo + syncOffset;
}

// lookahead scheduler: 짧은 간격으로 깨어나 다음 window 안에 도래하는
// 모든 걸 오디오 클럭에 맞춰 스케줄 -- setTimeout 절대 아님,
// 음악적 타이밍엔 너무 jitter 가 심해.
const LOOKAHEAD = 0.1;  // 초
setInterval(() => {
  while (next.srcTime < currentSrcTime() + LOOKAHEAD) {
    scheduleVoiceAt(audioTimeOf(next.srcTime), next);  // solo / 코드 / 메트로놈
    next = advance();
  }
}, 25);

External links

Exercise

동기화돼야 하는데 천천히 표류하는 두 가지가 있는 시스템을 찾아(애니메이션 둘, 진행바 둘, 타이머 둘). 물어: 각자 독립으로 시간을 추적해, 아니면 공유 클럭 하나를 읽어? 수정을 'anchor 하나 + 둘 다 거기서 파생' 으로 스케치해. 그게 Bonfire 의 voice 들을 맞물리게 한 그 수야.
Hint
setInterval/setTimeout 과 자기 시작 시간으로 스케줄된 건 표류해. 수정은 늘 두 컨슈머가 자기 위치를 파생하는 단일 권위 클럭이야 — 정렬을 바라는 타이머 둘이 아니라.

Progress

Progress is local-only — sign in to sync across devices.
이 페이지에서 버그를 발견하셨거나 피드백이 있으세요?문제 신고
💛 by 피파warm

댓글 0

🔔 답글 알림 (로그인 필요)
로그인댓글을 남기려면 로그인해 주세요.

아직 댓글이 없어요. 첫 댓글을 남겨보세요.