45 lines
852 B
TypeScript
45 lines
852 B
TypeScript
import { Profiler } from 'react';
|
|
import { Interaction } from 'scheduler/tracing';
|
|
|
|
import { logDebug } from '~/utils/logDebug';
|
|
|
|
type OwnProps = {
|
|
id: string;
|
|
children: React.ReactNode;
|
|
};
|
|
|
|
export const TimingProfiler = ({ id, children }: OwnProps) => {
|
|
const handleRender = (
|
|
id: string,
|
|
phase: 'mount' | 'update',
|
|
actualDuration: number,
|
|
baseDuration: number,
|
|
startTime: number,
|
|
commitTime: number,
|
|
interactions: Set<Interaction>,
|
|
) => {
|
|
logDebug(
|
|
'TimingProfiler',
|
|
JSON.stringify(
|
|
{
|
|
id,
|
|
phase,
|
|
actualDuration,
|
|
baseDuration,
|
|
startTime,
|
|
commitTime,
|
|
interactions,
|
|
},
|
|
null,
|
|
2,
|
|
),
|
|
);
|
|
};
|
|
|
|
return (
|
|
<Profiler id={id} onRender={handleRender}>
|
|
{children}
|
|
</Profiler>
|
|
);
|
|
};
|