Mirrors/blakeblackshear.frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2025-10-27 10:52:11 +01:00
Code Issues Projects Releases Wiki Activity

Fix stream stats display (#19874)

Browse Source 
* Fix stats calculations and labels

* fix linter from complaining

* fix mse calc

* label
This commit is contained in:
Josh Hawkins 2025-09-01 19:23:44 -05:00 committed by GitHub
parent f7ed8b4cab
commit 198e53bd42
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/player/JSMpegPlayer.tsx
View File

@ -164,7 +164,7 @@ export default function JSMpegPlayer({
statsIntervalRef.current = setInterval(() => { statsIntervalRef.current = setInterval(() => {
const currentTimestamp = Date.now(); const currentTimestamp = Date.now();
const timeDiff = (currentTimestamp - lastTimestampRef.current) / 1000; // in seconds const timeDiff = (currentTimestamp - lastTimestampRef.current) / 1000; // in seconds
const bitrate = (bytesReceivedRef.current * 8) / timeDiff / 1000; // in kbps const bitrate = bytesReceivedRef.current / timeDiff / 1000; // in kBps
setStats?.({ setStats?.({
streamType: "jsmpeg", streamType: "jsmpeg",

2
web/src/components/player/LivePlayer.tsx
View File

@ -80,7 +80,7 @@ export default function LivePlayer({
const [stats, setStats] = useState<PlayerStatsType>({ const [stats, setStats] = useState<PlayerStatsType>({
streamType: "-", streamType: "-",
bandwidth: 0, // in kbps bandwidth: 0, // in kBps
latency: undefined, // in seconds latency: undefined, // in seconds
totalFrames: 0, totalFrames: 0,
droppedFrames: undefined, droppedFrames: undefined,

4
web/src/components/player/MsePlayer.tsx
View File

@ -338,7 +338,7 @@ function MSEPlayer({
// console.debug("VideoRTC.buffer", b.byteLength, bufLen); // console.debug("VideoRTC.buffer", b.byteLength, bufLen);
} else { } else {
try { try {
sb?.appendBuffer(data); sb?.appendBuffer(data as ArrayBuffer);
} catch (e) { } catch (e) {
// no-op // no-op
} }
@ -592,7 +592,7 @@ function MSEPlayer({
const now = Date.now(); const now = Date.now();
const bytesLoaded = totalBytesLoaded.current; const bytesLoaded = totalBytesLoaded.current;
const timeElapsed = (now - lastTimestamp) / 1000; // seconds const timeElapsed = (now - lastTimestamp) / 1000; // seconds
const bandwidth = (bytesLoaded - lastLoadedBytes) / timeElapsed / 1024; // kbps const bandwidth = (bytesLoaded - lastLoadedBytes) / timeElapsed / 1000; // kBps
lastLoadedBytes = bytesLoaded; lastLoadedBytes = bytesLoaded;
lastTimestamp = now; lastTimestamp = now;

4
web/src/components/player/PlayerStats.tsx
View File

@ -17,7 +17,7 @@ export function PlayerStats({ stats, minimal }: PlayerStatsProps) {
</p> </p>
<p> <p>
<span className="text-white/70">{t("stats.bandwidth.title")}</span>{" "} <span className="text-white/70">{t("stats.bandwidth.title")}</span>{" "}
<span className="text-white">{stats.bandwidth.toFixed(2)} kbps</span> <span className="text-white">{stats.bandwidth.toFixed(2)} kBps</span>
</p> </p>
{stats.latency != undefined && ( {stats.latency != undefined && (
<p> <p>
@ -66,7 +66,7 @@ export function PlayerStats({ stats, minimal }: PlayerStatsProps) {
</div> </div>
<div className="flex flex-col items-center gap-1"> <div className="flex flex-col items-center gap-1">
<span className="text-white/70">{t("stats.bandwidth.short")}</span>{" "} <span className="text-white/70">{t("stats.bandwidth.short")}</span>{" "}
<span className="text-white">{stats.bandwidth.toFixed(2)} kbps</span> <span className="text-white">{stats.bandwidth.toFixed(2)} kBps</span>
</div> </div>
{stats.latency != undefined && ( {stats.latency != undefined && (
<div className="hidden flex-col items-center gap-1 md:flex"> <div className="hidden flex-col items-center gap-1 md:flex">

2
web/src/components/player/WebRTCPlayer.tsx
View File

@ -266,7 +266,7 @@ export default function WebRtcPlayer({
const bitrate = const bitrate =
timeDiff > 0 timeDiff > 0
? (bytesReceived - lastBytesReceived) / timeDiff / 1000 ? (bytesReceived - lastBytesReceived) / timeDiff / 1000
: 0; // in kbps : 0; // in kBps
setStats?.({ setStats?.({
streamType: "WebRTC", streamType: "WebRTC",