Latency histogramPro
The latency distribution with p50, p90 and p99, and slow request drill down.
On this page
Pro640 requests with a slow tail; pick a bin to list its requests.
Installation
Usage
import { LatencyHistogram } from "@/components/ui/chatcn/pro/latency-histogram"
<LatencyHistogram samples={samples} onOpen={openTrace} />The scale ends at the 99.5th percentile so a single outlier never flattens the plot; slower requests land in the last bin. Bins past p90 take the second chart hue, so the tail stands apart. Pick a bin to list its requests, slowest first.
Examples
States
ProFew requests in coarse bins, and none.
Props
| Prop | Type | Notes |
|---|---|---|
samples | { id, ms, label? }[] | One per request |
bins | number | Default 20 |
onOpen | (id) => void | Makes listed requests links |
Accessibility
- Each bin is a toggle button named by its range and count.
- Percentiles are also listed as text above the plot.