Explore Twig: live playground for AI Observability

Explore real code, inspect AI events, and try a hands-on lab

Twig is a live vacation rental website with PostHog built in. It's a playground that turns real code and instrumentation into hands-on labs, so you can learn by experimenting.

Explore Twig

See where your data comes from

See how real activity on a website generates product data, events, and identities in PostHog.

Session replay

0.0s / 19.1s

Inspector

Events

2 clicks4 pages

0:00
Browse staysPageview
event
$pageview
pathname
/
distinct_id
anon_7f3
$session_id
session_b2
0:07
City filterClick
0:10
Le Nid ChicPageview
0:12
Log inPageview
0:13
Identify EdgarIdentity
0:13
Le Nid ChicPageview
0:16
Save stayClick

Trace a request to the model

Twig’s AI feature recommends a stay from a trip request. Each request becomes a trace with the model call inside it.

$ai_tracelocal-trip-11.2s
$ai_generationRecommend a staytwig-fixture · 1.2s
$ai_tracelocal-trip-25s
$ai_generationRecommend a staytwig-fixture · 5s · error

Fig. – Two trips on Twig’s AI planner: one recommendation, and one request that timed out.

See what a generation records

Compare $ai_generation events and which properties and see why an LLM succeeded or failed.

Inspector

Event datarecommendation

capture payload

event: "$ai_generation"

properties {9}

$ai_span_id: "local-generation-1"

$ai_span_name: "Recommend a stay"

$ai_model: "twig-fixture"

$ai_provider: "local-simulation"

$ai_latency: 1.2

$ai_trace_id: "local-trip-1"

$ai_input: "A forest weekend for four, with a fire pit and lake access."

$ai_output_choices: "Try Adiron-shack: an A-frame in the Adirondacks with two king suites, a path to the lake, and a fire pit. Sleeps four, $355 per night."

$ai_is_error: false

Event datatimeout

capture payload

event: "$ai_generation"

properties {9}

$ai_span_id: "local-generation-2"

$ai_span_name: "Recommend a stay"

$ai_model: "twig-fixture"

$ai_provider: "local-simulation"

$ai_latency: 5

$ai_trace_id: "local-trip-2"

$ai_input: "A forest weekend for four, with a fire pit and lake access."

$ai_is_error: true

$ai_error: "Simulated provider timeout"

Fig. – The $ai_generation event for each trip. The timeout keeps the request and records the error.

Read the code behind the events

Capture andd store information that's relevant to your agent or LLM calls.

JavaScript
// Capture after the model call settles, using values from your application.
posthog.capture({
  distinctId: visitorId,
  event: '$ai_generation',
  properties: {
    $ai_model: model,
    $ai_provider: provider,
    $ai_span_id: generationId,
    $ai_latency: durationSeconds,
    $ai_trace_id: tripTraceId,
    $ai_input: [{ role: 'user', content: request }],
    ...(!error && { $ai_output_choices: [
      { role: 'assistant', content: response }
    ] }),
    $ai_is_error: Boolean(error),
    ...(error && { $ai_error: error.message }),
  },
})

Fig. – The capture call behind both events, from Twig’s AI lab.