import { useEffect, useState } from 'react';

export function useFps(sampleMs = 500): number {
  const [fps, setFps] = useState(60);

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

    const tick = (time: number) => {
      frameCount += 1;

      if (time - lastSampleTime >= sampleMs) {
        setFps(Math.round((frameCount * 1000) / (time - lastSampleTime)));
        frameCount = 0;
        lastSampleTime = time;
      }

      rafId = window.requestAnimationFrame(tick);
    };

    rafId = window.requestAnimationFrame(tick);

    return () => {
      window.cancelAnimationFrame(rafId);
    };
  }, [sampleMs]);

  return fps;
}