fps

Measure the rendering frame rate with requestAnimationFrame.


Package	`@vizejs/composable/fps`
Own the source	`vize lib pull composable:fps`
Runtime exports	`useFps`
Gzip budget	1536 B

Usage

import { useFps } from "@vizejs/composable/fps";

Runtime contract

Utility	Category	Stability	SSR	Hydration	Cleanup	Targets	Host globals	Uses
`useFps`	performance	experimental	deterministic-fallback	stable	reactive-scope	web, desktop	`window`	`tryOnScopeDispose`

API

`useFps`

Measure the rendering frame rate with requestAnimationFrame. Uses the frame timestamps passed to the callback (no extra clock) and publishes a rounded average every every frames. No frames are requested during server rendering (fps stays 0), and the pending frame is cancelled when paused or when the owning reactive scope stops.

function useFps(options: UseFpsOptions = {}): FpsControls

Types

`AnimationFrameHost`

Frame scheduling capability used by useFps.

Member	Type	Description
`requestAnimationFrame`	`(callback: FrameRequestCallback) => number`	Schedule a callback before the next repaint.
`cancelAnimationFrame`	`(handle: number) => void`	Cancel a scheduled frame.

`UseFpsOptions`

Options for useFps.

Member	Type	Description
`every`?	`number`	Number of frames averaged per update.
`immediate`?	`boolean`	Start measuring during composable creation.
`host`?	`MaybeRefOrGetter<AnimationFrameHost \| null \| undefined>`	Reactive frame-scheduling capability for alternate runtimes and tests.

`FpsControls`

Reactive frame-rate state returned by useFps.

Member	Type	Description
`fps`	`Readonly<Ref<number>>`	Frames per second averaged over the last `every` frames; `0` until measured.
`isSupported`	`Readonly<Ref<boolean>>`	Whether a frame-scheduling capability is attached. `false` during server rendering.
`isActive`	`Readonly<Ref<boolean>>`	Whether the frame loop is running.
`pause`	`() => void`	Stop the frame loop.
`resume`	`() => void`	Restart the frame loop.