administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-09 04:35:25 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Improve jpg loading

Browse Source
This commit is contained in:
Nicolas Mowen 2024-02-12 13:59:53 -07:00
parent c12852b4f2
commit 6cbd6becc6
1 changed files with 20 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
web/src/components/camera/AutoUpdatingCameraImage.tsx
View File

@ -1,4 +1,4 @@
import { useCallback, useState } from "react"; import { useCallback, useEffect, useState } from "react";
import CameraImage from "./CameraImage"; import CameraImage from "./CameraImage";
type AutoUpdatingCameraImageProps = { type AutoUpdatingCameraImageProps = {
@ -20,6 +20,18 @@ export default function AutoUpdatingCameraImage({
}: AutoUpdatingCameraImageProps) { }: AutoUpdatingCameraImageProps) {
const [key, setKey] = useState(Date.now()); const [key, setKey] = useState(Date.now());
const [fps, setFps] = useState<string>("0"); const [fps, setFps] = useState<string>("0");
const [timeoutId, setTimeoutId] = useState<NodeJS.Timeout>();
useEffect(() => {
setKey(Date.now());
return () => {
if (timeoutId) {
clearTimeout(timeoutId);
setTimeoutId(undefined);
}
};
}, [reloadInterval]);
const handleLoad = useCallback(() => { const handleLoad = useCallback(() => {
const loadTime = Date.now() - key; const loadTime = Date.now() - key;
@ -28,11 +40,13 @@ export default function AutoUpdatingCameraImage({
setFps((1000 / Math.max(loadTime, reloadInterval)).toFixed(1)); setFps((1000 / Math.max(loadTime, reloadInterval)).toFixed(1));
} }
setTimeout( setTimeoutId(
() => { setTimeout(
setKey(Date.now()); () => {
}, setKey(Date.now());
loadTime > reloadInterval ? 1 : reloadInterval },
loadTime > reloadInterval ? 1 : reloadInterval
)
); );
}, [key, setFps]); }, [key, setFps]);