Een geluidsmotor helemaal opnieuw opbouwen is een overgangsrite. Je wilt de klok begrijpen. De timing. De rauwe logica die stilte in ritme verandert. Een sequencer is die logica. Het is een raster. Je plaatst aantekeningen. Jij gaat vooruit.
De meeste tutorials slaan het moeilijke gedeelte over. Ze laten je een bibliotheek zien. Ze laten je een GUI zien. Ze laten je niet zien hoe je met de drift om moet gaan. De timingfouten die binnensluipen als je de tijd handmatig bijhoudt.
Laten we dat oplossen.
We bouwen een eenvoudige stepsequencer. Het zal op een eenvoudige lus draaien. Het zal geluiden activeren. Het houdt de tijd bij zonder vooruit te kijken. Deze aanpak voorkomt het “schokkerige” gevoel dat je krijgt als je setTimeout gebruikt voor lange lussen.
Het kernconcept: stapgebaseerde timing
Een sequencer werkt met stappen. Geen seconden. Stappen.
Als uw tempo 120 BPM is, duurt elke tel 0,5 seconde. Als u 16 stappen heeft, duurt elke stap 0,125 seconden. De magie gebeurt wanneer je je aan deze intervallen houdt.
“Tijd is geen continue stroom in een sequencer. Het is een reeks afzonderlijke gebeurtenissen. Synchroniseren met deze gebeurtenissen is alles.”
We hebben een manier nodig om te berekenen wanneer elke stap plaatsvindt. Niet door te raden. Door wiskunde.
De klok instellen
Je hebt een referentiepunt nodig. De starttijd.
In JavaScript geeft Date.now() of performance.now() milliseconden. Hiermee bereken je de drift.
- Definieer het tempo.
- Bereken de stapduur.
- Start een lus.
Hier is het skelet. Het is niet mooi. Het werkt.
Deze code is eenvoudig. Het gebruikt setTimeout. Het is niet perfect. Maar het is een begin.
Waarom dit belangrijk is
Waarom zelf bouwen?
Bibliotheken zoals Tone.js of Web Audio API-wrappers zijn geweldig. Zij verzorgen de complexe planning. Ze compenseren de latentie.
Maar je leert niet hoe ze werken door ze te gebruiken. Je leert door te zien waar ze falen.
Wanneer setTimeout afdrijft, wiebelt je beat. Het klinkt menselijk. Het klinkt verkeerd.
Omgaan met de drift
De if (nextStepTime < Date.now()) -controle is van cruciaal belang.
Het
