shadcn.io is not affiliated with official shadcn/ui
AI Engineer Latency Budget Profile Block for Ark UI
An AI engineer profile as a latency budget: six invented models on a drawn scatter of p95 latency against accuracy with a stepped frontier, a slider that dims the models over budget and names the best one left, and a model card for the point you press.
Installation
Overview
Pick a model by what it costs in time, with this AI engineer profile for React with Ark UI. The header says what the console is for, and the hairline frame under it opens on the engineer: initials, name, role and place. The main cell is a drawn scatter with p95 latency across and accuracy up, six models as pressable points and a stepped line through the ones nothing beats on both counts. Under it a Slider sets the p95 budget from 50 to 800 ms: a line crosses the plot, the models over it turn hollow, and a sentence names the best one that remains, such as Best within 300 ms: Orvane 2, 91.2%. Pressing a point fills the model card in the end cell with its size, context window, latency, accuracy, the day it was last evaluated and whether another model is both faster and more accurate. It's built from Slider, Data List, Badge, Avatar and Guides, with a CSS entrance only. The models and every evaluation are invented. For a serving console, an engineer's page or a model comparison.
FAQ
How do I use my own models?
Edit MODELS. Each has an id, a name, its lab, the p95 latency in milliseconds, the accuracy in tenths of a percent (912 is 91.2%), a context window, a size and the ISO day of its last evaluation. The axes run from 0 to 800 ms and from 75 to 95 percent; change MAX_BUDGET, FLOOR and SPAN if your numbers sit elsewhere. The frontier, the models within the budget, the best one and each card's verdict are all worked out from those rows.
What is the stepped line?
It joins the models that no other model beats on both counts: nothing is both faster and at least as accurate. The line steps because it shows the best accuracy you can reach at each latency. A model off the line, like Orvane 2 Vision here, is beaten by one on it, and its card says which.
Is the chart readable without seeing it?
Every point is a button named with the model, its latency, its accuracy and whether it is within the budget, and a hidden table repeats the same six rows. The slider has a name and speaks its value in milliseconds, and the answer is spoken once it has settled rather than on every step. Over-budget points are hollow, not only paler, so the state shows without colour.
Is anything measured or sent?
No. The models are invented, and the latencies and accuracies are example figures, not a benchmark. The slider and the points only change what the page shows. To make it real, load the rows from your evaluation store and keep the last evaluation date next to each one.