Fps

Small overlay showing live FPS for debugging; optional portal to document body, color by thresholds.

Indicador de frames por segundo para depuração de performance. O componente está em @zexon/ui/components/fps. Com strategy="fixed", o conteúdo renderiza num portal para document.body (ou para portalContainer) após o mount, para não ficar preso à hierarquia do layout. Com strategy="absolute", renderiza no sítio (o antecessor deve ter position definido).

A cor do valor segue status interno: bom (text-primary), aviso abaixo de warningThreshold, erro abaixo de errorThreshold.

Importação

import { Fps } from "@zexon/ui/components/fps";

Uso

Exemplo

Para sobrepor à viewport inteira, usa strategy="fixed" (predefinição) e, se precisares, portalContainer para outro nó. enabled={false} remove o componente.

Props

Prop	Tipo	Predefinição	Notas
`strategy`	`"fixed" \| "absolute"`	`"fixed"`	`fixed` usa portal (quando há contentor)
`position`	`"top-left" \| "top-right" \| "bottom-left" \| "bottom-right"`	`"top-right"`	Cantos em `top-` / `bottom-` e `left-` / `right-`
`label`	`string`	—	Prefixo antes do valor (ex.: `FPS`)
`updateInterval`	`number`	`500`	Intervalo em ms entre recálculos do valor exibido
`warningThreshold`	`number`	`30`	Abaixo disto, estado de aviso
`errorThreshold`	`number`	`20`	Abaixo disto, estado de erro
`portalContainer`	`Element \| DocumentFragment \| null`	`document.body` após mount	Só relevante com `strategy="fixed"`
`enabled`	`boolean`	`true`	Se `false`, não renderiza
`className`	`string`	—	Classes extra no contentor

O estado visual (status) é calculado internamente; não é exposto como prop. Demais atributos repassam-se ao div raiz.

Field

Hover Card