Function useLiveStream

packages/client/src/features/stream/useLiveStream.ts:110–537

({
  canvasElement,
  paused = false,
  remote = false,
  simulator,
  streamConfig,
  streamConfigApplyKey = 0,
  streamTransport = "auto",
}: UseLiveStreamOptions)

}

export function useLiveStream({
  canvasElement,
  paused = false,
  remote = false,
  simulator,
  streamConfig,
  streamConfigApplyKey = 0,
  streamTransport = "auto",
}: UseLiveStreamOptions): UseLiveStreamResult {
  const clientTelemetryIdRef = useRef("");
  const workerClientRef = useRef<StreamWorkerClient | null>(null);
  const latestDecodedFramesRef = useRef(0);
  const latestFpsRef = useRef(0);
  const latestRenderedFramesRef = useRef(0);
  const latestStatsRef = useRef<StreamStats>(createEmptyStreamStats());
  const latestStatusRef = useRef<StreamStatus>({ state: "idle" });
  const retainedFrameRef = useRef(false);
  const previousSimulatorUdidRef = useRef<string | undefined>(simulator?.udid);
  const connectedStreamTargetKeyRef = useRef("");
  const canvasVisibleRef = useRef(true);
  const latestVisualArtifactRef = useRef<VisualArtifactSample | null>(null);
  const latestVisualArtifactSampleCountRef = useRef(0);
  const lastVisualArtifactSampleAtRef = useRef(0);
  const pageFpsRef = useRef(0);
  const [deviceNaturalSize, setDeviceNaturalSize] = useState<Size | null>(null);
  const [stats, setStats] = useState<StreamStats>(createEmptyStreamStats);
  const [status, setStatus] = useState<StreamStatus>({ state: "idle" });
  const [error, setError] = useState("");
  const [fps, setFps] = useState(0);
  const [streamCanvasRevision, setStreamCanvasRevision] = useState(0);
  const [runtimeInfo] = useState<StreamRuntimeInfo>(detectRuntimeInfo);

  if (!clientTelemetryIdRef.current) {
    clientTelemetryIdRef.current = createClientTelemetryId();
  }

  useEffect(() => {
    let frameCount = 0;
    let lastSampleAt = performance.now();
    let rafId = 0;

    const tick = () => {
      frameCount += 1;
      const now = performance.now();
      const elapsedMs = now - lastSampleAt;
      if (elapsedMs >= CLIENT_TELEMETRY_INTERVAL_MS) {
        pageFpsRef.current = (frameCount * 1000) / elapsedMs;
        frameCount = 0;
        lastSampleAt = now;
      }

      rafId = window.requestAnimationFrame(tick);
    };

    rafId = window.requestAnimationFrame(tick);
    return () => {
      window.cancelAnimationFrame(rafId);
    };