demo · v135
N-participant captions
Before Chrome 135, SpeechRecognition only used the default microphone. Now you can bind any MediaStreamTrack — one per remote participant — and run N recognisers simultaneously. This page lets you add participants dynamically. Participant 1 uses your real microphone and produces live captions. Added participants use a synthetic audio source to show the pattern when the real remote tracks arrive.
SpeechRecognition: ?
start(track): ?
Real conference scenario: In production, participant tracks come from a WebRTC
RTCPeerConnection's ontrack event. You pass each event.track directly to a new SpeechRecognition instance. Participants added here use a synthetic OscillatorNode as the track source — the API pattern is identical; only the audio content differs.
Conference call — live captions
0 recognisers active
0 / 6 participants
the pattern
// In a real WebRTC conference:
peerConnection.ontrack = ({ track }) => {
const lane = createLane(track.label);
startRecognition(lane, track);
};
function startRecognition(lane, track) {
const rec = new SpeechRecognition();
rec.continuous = true;
rec.interimResults = true;
rec.onresult = e => lane.updateTranscript(e.results);
rec.onend = () => { if (!lane.stopped) rec.start(track); };
rec.start(track); // Chrome 135+
track.addEventListener('ended', () => {
lane.stopped = true;
rec.abort();
lane.remove();
});
}