Cache miss request
Dashboard load when the cache is cold
Request
Fallback
Response and trace
User
Browser session
Web app
React UI
API
Request handler
Auth
JWT verify
Redis
Cache
Postgres
Source of truth
Trace
Async event
open page
GET /dashboard
verify JWT
claims ok
read cache
miss
query profile
rows
set cache
emit trace
200 JSON
render
diagram.html#The link keeps the view, selection, route and playback.
About this diagram
Messages over time between a few participants, for one scenario: a request with a cache miss, an async job round trip.
Ask for one like it
Draw the request path for a dashboard load as a sequence, including the cache miss.
The JSON
{ "kind": "sequence", "title": "Cache miss request", "subtitle": "Dashboard load when the cache is cold", "phases": [ { "id": "request", "label": "Request", "edges": ["open", "get", "verify", "claims"] }, { "id": "fallback", "label": "Fallback", "edges": ["read", "miss", "query", "rows"] }, { "id": "respond", "label": "Response and trace", "edges": ["set", "emit", "json", "render"] } ], "nodes": [ { "id": "user", "type": "client", "card": { "title": "User", "subtitle": "Browser session" } }, { "id": "web", "type": "client", "card": { "title": "Web app", "subtitle": "React UI", "brand": "react" } }, { "id": "api", "type": "service", "card": { "title": "API", "subtitle": "Request handler" } }, { "id": "auth", "type": "security", "card": { "title": "Auth", "subtitle": "JWT verify" } }, { "id": "redis", "type": "cache", "card": { "title": "Redis", "subtitle": "Cache", "brand": "redis" } }, { "id": "db", "type": "database", "card": { "title": "Postgres", "subtitle": "Source of truth", "brand": "postgresql" } }, { "id": "trace", "type": "queue", "card": { "title": "Trace", "subtitle": "Async event" } } ], "edges": [ { "id": "open", "from": "user", "to": "web", "label": "open page" }, { "id": "get", "from": "web", "to": "api", "label": "GET /dashboard", "tone": "main" }, { "id": "verify", "from": "api", "to": "auth", "label": "verify JWT", "tone": "security" }, { "id": "claims", "from": "auth", "to": "api", "label": "claims ok", "kind": "return" }, { "id": "read", "from": "api", "to": "redis", "label": "read cache" }, { "id": "miss", "from": "redis", "to": "api", "label": "miss", "kind": "return" }, { "id": "query", "from": "api", "to": "db", "label": "query profile", "tone": "main" }, { "id": "rows", "from": "db", "to": "api", "label": "rows", "kind": "return" }, { "id": "set", "from": "api", "to": "redis", "label": "set cache", "kind": "async" }, { "id": "emit", "from": "api", "to": "trace", "label": "emit trace", "kind": "async" }, { "id": "json", "from": "api", "to": "web", "label": "200 JSON", "kind": "return" }, { "id": "render", "from": "web", "to": "user", "label": "render", "kind": "return" } ], "views": [ { "id": "fallback", "label": "Fallback", "caption": "The database is read only after the cache misses.", "nodes": ["api", "redis", "db"] } ], "notes": [ { "title": "Happy path", "items": [ "Web app → API → data source → response", "Replies are quieter than forward calls", "Activation bars show how long each part is busy" ] }, { "title": "Policy and fallback", "items": [ "JWT verification is a security interaction", "The cache miss is visible without overpowering the main path" ] }, { "title": "Async trace", "items": [ "Trace emission is fire-and-forget", "It never blocks the response" ] } ]}