Tom Boullay
25 lines
570 B
TypeScript
25 lines
570 B
TypeScript
import { Suspense, lazy } from "react";
|
|
import { useShowDebugPerf } from "@/hooks/debug/useShowDebugPerf";
|
|
|
|
const Perf = lazy(() => import("r3f-perf").then((m) => ({ default: m.Perf })));
|
|
|
|
const DEBUG_GUI_WIDTH = 245;
|
|
const DEBUG_PANEL_GAP = 20;
|
|
|
|
export function DebugPerf(): React.JSX.Element | null {
|
|
const showDebugPerf = useShowDebugPerf();
|
|
|
|
if (!showDebugPerf) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<Suspense fallback={null}>
|
|
<Perf
|
|
position="top-right"
|
|
style={{ right: DEBUG_GUI_WIDTH + DEBUG_PANEL_GAP }}
|
|
/>
|
|
</Suspense>
|
|
);
|
|
}
|