About Octype
Product Philosophy
Octype was created to address a common problem in browser-based virtual pianos: latency. Many online pianos are built as standard React or JavaScript applications where audio events are bound to rendering cycles. This creates audible gaps, clicks, and timing jitters, rendering the instrument frustrating for musical play.
Octype's core philosophy is simple: performance comes first. By structuring the application as a dedicated audio engine that merely communicates status to a React visual shell, we achieve highly precise timing that feels responsive and alive, just like a real instrument.
Decoupled Web Audio Architecture
The fundamental design pattern in Octype is the separation of audio synthesis from React. All keyboard inputs, touch movements, and incoming MIDI streams route through a central singletone dispatcher (InputRouter) directly into a standalone AudioEngine. This bypasses React's diffing algorithms, rendering loops, and Zustand store updates.
This architectural separation ensures that even if the UI experiences performance stutters (such as complex visual transitions or background tasks), the audio playback thread runs uninterrupted.
Salamander Grand Sound Synthesis
Rather than relying on flat synthetic oscillators, Octype uses Alexander Holm'sSalamander Grand Piano, a high-quality open-source sampled Yamaha C5 grand piano. The sample library records physical notes at 16 velocity layers.
Octype loads these samples progressively:
- Core Stage: Loads the middle octaves at medium velocity (layer 8) so the piano can start playing instantly.
- Background Stage: Streams and decodes the remaining octaves and velocity layers silently in the background.
- On-Demand Upgrade: If you strike a note that has not loaded yet, the engine queries it, plays a nearby fallback layer, and upgrades that note cache for subsequent strikes.