{{ template "head" . }}

{{ template "prom_content_head" . }}
<h1>frugal-metrics — Per-model</h1>
<p><a href="index.html.example">&laquo; back to index</a></p>

<h3>Call rate by model</h3>
<div id="rateByModel"></div>
<script>
new PromConsole.Graph({
  node: document.querySelector("#rateByModel"),
  expr: "sum by (gen_ai_request_model) (rate(frugal_gen_ai_calls_total[1m]))",
  name: "[[gen_ai_request_model]]",
  yAxisFormatter: PromConsole.NumberFormatter.humanize,
  renderer: "line",
});
</script>

<h3>Latency p50</h3>
<div id="p50"></div>
<script>
new PromConsole.Graph({
  node: document.querySelector("#p50"),
  expr: "histogram_quantile(0.50, sum by (le, gen_ai_request_model) (rate(gen_ai_client_operation_duration_seconds_bucket[5m])))",
  name: "[[gen_ai_request_model]]",
  yAxisFormatter: PromConsole.NumberFormatter.humanize,
  renderer: "line",
});
</script>

<h3>Latency p99</h3>
<div id="p99"></div>
<script>
new PromConsole.Graph({
  node: document.querySelector("#p99"),
  expr: "histogram_quantile(0.99, sum by (le, gen_ai_request_model) (rate(gen_ai_client_operation_duration_seconds_bucket[5m])))",
  name: "[[gen_ai_request_model]]",
  yAxisFormatter: PromConsole.NumberFormatter.humanize,
  renderer: "line",
});
</script>

<h3>Input tokens / second by model</h3>
<div id="tokIn"></div>
<script>
new PromConsole.Graph({
  node: document.querySelector("#tokIn"),
  expr: "sum by (gen_ai_request_model) (rate(gen_ai_client_token_usage_sum{gen_ai_token_type=\"input\"}[1m]))",
  name: "[[gen_ai_request_model]]",
  yAxisFormatter: PromConsole.NumberFormatter.humanize,
  renderer: "line",
});
</script>

<h3>Output tokens / second by model</h3>
<div id="tokOut"></div>
<script>
new PromConsole.Graph({
  node: document.querySelector("#tokOut"),
  expr: "sum by (gen_ai_request_model) (rate(gen_ai_client_token_usage_sum{gen_ai_token_type=\"output\"}[1m]))",
  name: "[[gen_ai_request_model]]",
  yAxisFormatter: PromConsole.NumberFormatter.humanize,
  renderer: "line",
});
</script>

{{ template "prom_content_tail" . }}

{{ template "tail" . }}