Skip to main content
Session replay records what users actually do in your product. Watch sessions like a movie to debug issues, analyze drop-offs, and understand behavior that analytics alone can’t explain.

How it works

Session replay captures everything users see and do:
  • DOM snapshots: Full page state at each moment
  • Mouse movements and clicks: See exactly where users interact
  • Console logs and errors: Debug issues with full technical context
  • Network requests: View API calls and response times
  • Performance data: Identify slow loads and rendering issues
Replays are privacy-safe by default. PostHog automatically masks text inputs, images, and sensitive data.

Setting up replay

Session replay starts recording once you enable it:
1

Enable in PostHog

posthog.init('<ph_project_api_key>', {
  api_host: '<ph_instance_address>',
  
  // Enable session replay
  session_recording: {
    recordCrossOriginIframes: true,
    maskAllInputs: true,  // Mask all inputs by default
    maskTextSelector: '*',  // Mask all text initially
  }
})
2

Configure privacy settings

Control what gets recorded:
  • maskAllInputs: Mask password and text inputs
  • maskTextSelector: CSS selector for elements to mask
  • blockSelector: Fully block elements from recording
3

Sample recording rate

Record a percentage of sessions to manage volume:
posthog.init('<ph_project_api_key>', {
  session_recording: {
    // Record 20% of sessions
    sessionRecordingVersion: 'v2',
    sampling: {
      sessionRecording: 0.2
    }
  }
})

Watching replays

Access replays from multiple entry points:
  1. Navigate to Session replay in the sidebar
  2. Filter by date, duration, or user properties
  3. Click any session to watch
  4. Use playback controls (play, pause, skip, speed)

Replay features

Console logs

See JavaScript console output during the session:
  • Errors: Red console errors with stack traces
  • Warnings: Yellow warnings from the browser
  • Info/debug: Custom log messages from your code
  • Network errors: Failed API calls and HTTP errors
Click the console icon in replay to open the console panel and see logs timestamped with the replay.

Network panel

Inspect network activity during the session:
// Network requests appear automatically in replay
fetch('/api/users/123')
  .then(res => res.json())
  .then(data => console.log(data))
The network panel shows:
  • Request URL and method
  • Response status and timing
  • Request/response headers
  • Payload data (if not sensitive)
You can configure which network requests to capture. By default, PostHog captures headers but not request bodies.

Performance tracking

Replay includes performance metrics:
  • Page load time: Time to interactive
  • DOM events: When elements render
  • Resource timing: Script and image load times
  • Frame rate: Identify laggy interactions
Use this to diagnose slow experiences that frustrate users.

Event timeline

See custom events alongside the replay:
  • Every event you track appears on the timeline
  • Click events to jump to that moment
  • Understand event sequence and timing
  • Verify events fire at the right moment

Privacy controls

Protect sensitive information in replays:
Automatically hide sensitive text:
posthog.init('<ph_project_api_key>', {
  session_recording: {
    // Mask all text content
    maskTextSelector: '*',
    
    // Mask all inputs (including selects)
    maskAllInputs: true,
    
    // Block specific elements completely
    blockSelector: '.sensitive-data, #credit-card'
  }
})
Unmask specific elements you want to see:
<!-- This text will be visible in replay -->
<div data-ph-capture-attribute-unmask="true">
  Product name: Premium Plan
</div>

<!-- This input will be visible -->
<input data-ph-capture-attribute-unmask="true" value="[email protected]" />
Completely prevent recording of sensitive areas:
<!-- This entire section won't be recorded -->
<div data-ph-no-capture>
  <h2>Payment Information</h2>
  <input name="card_number" />
</div>

Common workflows

Debug user-reported issues

When users report problems, filter replays by their email or user ID. Watch their session to see the exact error.

Analyze funnel drop-offs

Click a funnel drop-off point and watch replays of users who left. Find common patterns or confusion points.

Validate new features

After launching a feature, watch replays of users trying it for the first time. See if they understand the UI.

Improve onboarding

Filter for new users’ first sessions. Watch where they get stuck or confused in your onboarding flow.

Playlists

Organize replays into playlists for team review:
1

Create a playlist

  1. Go to Session replayPlaylists
  2. Click New playlist
  3. Name it (e.g., “Checkout issues”, “Mobile UX problems”)
2

Add replays

While watching any replay, click Add to playlist and select your playlist.
3

Share with team

Share the playlist URL with your team. Great for weekly UX reviews or bug triage.

Filtering replays

Find specific sessions quickly:
  • By user properties: Email, name, plan tier, signup date
  • By events: Sessions containing specific events
  • By duration: Only sessions longer than X seconds
  • By console errors: Sessions with JavaScript errors
  • By date range: Last 7 days, last month, custom range
Combine filters to narrow down. For example: “sessions with checkout_started event” + “contains console error” + “from mobile users”.

Replay settings

Configure replay behavior in SettingsReplay:
  • Recording rate: Sample percentage to record (10%, 50%, 100%)
  • Minimum duration: Only save sessions longer than X seconds
  • Retention: How long to keep replays (30, 60, 90 days)
  • Capture performance: Include performance metrics
  • Canvas recording: Record canvas elements (increases file size)

Mobile replay

PostHog supports mobile session replay for iOS and Android:
// iOS configuration
let config = PostHogConfig(apiKey: "<ph_project_api_key>")
config.sessionReplay = true
config.sessionReplayConfig.maskAllTextInputs = true
PostHogSDK.shared.setup(config)
Mobile replay captures:
  • Screen recordings (wireframe mode for privacy)
  • Touch interactions and gestures
  • Network requests
  • App logs and crashes

Performance impact

Session replay is optimized for minimal performance impact:
  • Async recording: Doesn’t block the main thread
  • Compression: Replays are compressed before sending
  • Batching: Network requests are batched
  • Sampling: Record only a percentage of sessions
Typical impact is less than 5% CPU and minimal memory overhead. Test with your specific app to verify.

Best practices

Begin by recording all sessions to ensure you capture issues. Once you understand volume, reduce to 20-50% sampling.
Build playlists for recurring patterns: rage clicks, error flows, confusion points. Share with your team weekly.
Don’t just watch random replays. Use analytics to find problematic cohorts, then watch their replays to understand why.

Build docs developers (and LLMs) love