Latency
這一頁還沒有中文版，以下顯示英文原文。
The browser buffers a few hundred milliseconds of video before it plays. On a fast local network, that buffer only adds delay. jitterBufferTarget sets how much to buffer: less buffering means less delay, but more freezes.
Set the buffer
import { PiCamera } from '@mazupo/client';
const camera = new PiCamera({
uid: 'your-custom-uid',
mqttHost: 'your.mqtt.cloud',
mqttPath: '/mqtt',
mqttPort: 8084,
mqttUsername: 'hakunamatata',
mqttPassword: 'Wonderful',
stunUrls: ['stun:stun1.l.google.com:19302'],
jitterBufferTarget: 10,
});
camera.onStream = (stream) => {
document.querySelector('#videoElement').srcObject = stream;
};
camera.connect();
// Buffer more when the network turns out to be worse.
document.querySelector('#buffer').oninput = (event) => {
camera.setJitterBufferTarget(Number(event.target.value));
};Measure the result
The browser moves toward the target over several seconds. getStats() shows how much it really buffers, and freezeCount shows the cost.
let last = null;
setInterval(async () => {
const report = await camera.getStats();
report?.forEach((stat) => {
if (stat.type !== 'inbound-rtp' || stat.kind !== 'video') {
return;
}
if (last && stat.jitterBufferEmittedCount > last.count) {
const ms = (stat.jitterBufferDelay - last.delay) /
(stat.jitterBufferEmittedCount - last.count) * 1000;
console.log(`buffered ${ms.toFixed(0)}ms, ${stat.freezeCount} freezes`);
}
last = { delay: stat.jitterBufferDelay, count: stat.jitterBufferEmittedCount };
});
}, 2000);See setJitterBufferTarget for the browser support.
Guides
Short, complete examples for each task. Every example connects over MQTT unless it says otherwise. uid must match the --uid of the device, and the MQTT setti...
Bandwidth
Limit how much video the device sends to a viewer. A small tile on a monitoring wall does not need full quality, and a lower bitrate saves cloud and mobile d...