{{ template "head" . }}

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

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

<h3>Error rate (errors / second, 1m)</h3>
<div id="errRate"></div>
<script>
new PromConsole.Graph({
  node: document.querySelector("#errRate"),
  expr: "sum by (frugal_error_type) (rate(frugal_gen_ai_errors_total[1m]))",
  name: "[[frugal_error_type]]",
  yAxisFormatter: PromConsole.NumberFormatter.humanize,
  renderer: "line",
});
</script>

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

<h3>Latency p95 (seconds)</h3>
<div id="p95"></div>
<script>
new PromConsole.Graph({
  node: document.querySelector("#p95"),
  expr: "histogram_quantile(0.95, 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>

{{ template "prom_content_tail" . }}

{{ template "tail" . }}