# rrweb - 웹용 레코드 & 리플레이 디버거

> Clean Markdown view of GeekNews topic #16104. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=16104](https://news.hada.io/topic?id=16104)
- GeekNews Markdown: [https://news.hada.io/topic/16104.md](https://news.hada.io/topic/16104.md)
- Type: news
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2024-07-31T10:16:01+09:00
- Updated: 2024-07-31T10:16:01+09:00
- Original source: [github.com/rrweb-io](https://github.com/rrweb-io/rrweb)
- Points: 15
- Comments: 0

## Summary

rrweb은 사용자 인터랙션을 녹화하고 재생할 수 있는 도구로, 웹 디버깅에 유용합니다. 이 도구는 스냅샷과 리빌드, 레코드와 리플레이, 그리고 플레이어 UI로 구성되어 있어 다양한 디버깅 상황에 대응할 수 있습니다. 특히, DOM의 모든 변화를 기록하고 재생할 수 있어 문제 해결에 큰 도움이 됩니다.

## Topic Body

- 사용자 인터랙션을 녹화하여 다시 재생해주는 도구  
- 3가지 요소로 구성됨   
  - rrweb-snapshot : Snapshot & Rebuild   
    - 스냅샷: DOM과 그 상태를 고유 식별자를 가진 직렬화 가능한 데이터 구조로 변환   
    - 리빌드: 스냅샷을 해당 DOM으로 다시 빌드   
  - rrweb : Record & Replay   
    - 레코드: DOM의 모든 변화를 기록   
    - 리플레이: 기록된 모든 변화를 타임스탬프에 따라 하나씩 재생   
  - rrweb-player : rrweb을 위한 플레이어 UI. 멈춤, 빨리감기, Drag & Drop 을 지원

## Comments



_No public comments on this page._