브라우저 세션

실제 동작을 보고, 트레이스를 엽니다

리플레이는 사용자가 무엇을 했는지 보여주고, 그 아래 트레이스는 왜 실패했는지 보여줍니다. 둘은 같은 세션 ID를 갖기 때문에 오가는 데 클릭 한 번이면 되고, 상황을 다시 짜맞출 필요가 없습니다.

화면

녹화와 증거를 나란히

뷰포트는 렌더링된 그대로 재생되고, 콘솔 줄·네트워크 요청·발생한 예외가 그것을 유발한 클릭과 같은 타임라인에 놓입니다.

/replays session s_9f31 · 6:12

움직임

커서가 '지금 결제'로 이동하고, 클릭이 일어나고, 그 옆에서 이벤트 스트림이 채워집니다. 각 항목에는 자신이 속한 트레이스 ID가 붙어 있습니다.

replay · checkout flow LIVE

app.acme.com/checkout Chrome macOS Desktop

trace ↳ 9f3c · POST /api/pay 1.24s · 5 spans

edge 1.24s

api 180ms

payment-svc 880ms

stripe 690ms

postgres 85ms

1 session · 9 events · 2 errors trace-linked · 30d retention

할 수 있는 일

모든 이벤트를 순서대로: 내비게이션·클릭·입력·콘솔 줄·네트워크 호출·에러가 하나의 정렬된 스트림에 놓입니다. 각 행에는 그 시점에 유효했던 트레이스 ID가 기록됩니다.
픽셀 단위로 정확한 리플레이: 화면이 아니라 DOM을 기록합니다. 스크롤 위치, 호버 상태, 입력 도중의 값까지 사용자가 남긴 그대로, 어떤 창 크기에서도 재생됩니다.
특정 순간에서 스팬으로: 실패한 클릭에서 일시정지하고 그때 발생한 요청을 엽니다. 리플레이와 워터폴은 하나의 세션 ID에 대한 두 가지 뷰이지, 타임스탬프로 이어 붙인 별개 제품이 아닙니다.
콘솔과 네트워크를 인라인으로: 요청은 메서드·상태·소요 시간과 함께 기록됩니다. POST /checkout의 500은 별도 탭이 아니라 응답이 돌아온 그 초에 스트림에 나타납니다.
전송 전에 마스킹: 입력란과 텍스트 노드는 무엇이든 전송되기 전에 브라우저에서 마스킹됩니다. 샘플링 비율과 가림 규칙은 설정 항목이지 지원 요청 사항이 아닙니다.