I built a tool to master PROMQL

#webdev #devops #opensource #devex

My team recently moved from New Relic to OTEL. So, I decided to build a tool that teaches them PROMQL by going through several common scenarios. This could be a game-changer for teams that are migrating from paid SaaS observability tools to in-house monitoring.

Introducing PROMQL Playground

An interactive learning environment for Prometheus Query Language (PromQL). Write queries, visualize results, and learn PromQL concepts through hands-on examples.

Features

Interactive Query Editor - Monaco-based editor with syntax highlighting and autocomplete
Real Prometheus Data - Connects to demo.promlabs.com for real metrics
Visualizations - Time series graphs with zoom, pan, and series filtering
Learning Scenarios - Guided tutorials covering PromQL concepts
Query Explanation - Step-by-step breakdown of query execution
Function Reference - Documentation for all PromQL functions

Learning Scenarios

The playground includes guided scenarios to learn PromQL:

Getting Started - Basic queries, metrics, and labels
Error Rate Tracking - Monitor 4xx/5xx errors, calculate SLIs
HTTP Request Analysis - Request rates, throughput, grouping
Latency Analysis - Histograms, percentiles, p50/p95/p99
Resource Usage - CPU, memory, disk monitoring
Aggregation Deep Dive - sum, avg, max, min, count
Top/Bottom Analysis - topk, bottomk for rankings
Time Comparisons - Using offset for historical comparisons
Rate Windows - Understanding rate() window sizes

Available Metrics

The demo server (demo.promlabs.com) provides these metrics:

Metric	Type	Description
`demo_api_request_duration_seconds`	Histogram	HTTP request latency
`demo_api_http_requests_in_progress`	Gauge	Current in-flight requests
`demo_cpu_usage_seconds_total`	Counter	CPU time consumed
`demo_memory_usage_bytes`	Gauge	Memory usage
`demo_disk_usage_bytes`	Gauge	Disk space used
`demo_disk_total_bytes`	Gauge	Total disk space
`demo_items_shipped_total`	Counter	Business metric example