# rrweb
## Overview
> **Deprecated.** `rrweb` is kept for backward compatibility only. New projects should depend on [@rrweb/record](packages/record/) and [@rrweb/replay](packages/replay/) directly, or use [@rrweb/all](packages/all/) for a single convenience import. Moving to these entrypoints lets us slim down and eventually remove this package.
rrweb refers to 'record and replay the web', a tool for recording and replaying users' interactions on the web.
In most production setups, the recorder and replayer are deployed to different pages/apps. Use [@rrweb/record](packages/record/) on recorded pages and [@rrweb/replay](packages/replay/) (or [rrweb-player](packages/rrweb-player/) to include UI) on replay pages.
| Use case | Package choice |
| ----------------------------------------------- | --------------------------------- |
| Most apps (explicit record/replay dependencies) | `@rrweb/record` + `@rrweb/replay` |
| Single import for record, replay + packer | `@rrweb/all` |
### Dev Note
As this was the original rrweb package, typescript code for both @rrweb/record and @rrweb/replay still lives in src/record and src/replay in this package. These will be refactored into their respective packages in due course, but for now this package is the principal one for both record and replay related PRs. See [Contributing to rrweb](../../CONTRIBUTING.md) for more info.
## Installation
### 1) Bundler / npm (Recommended)
For new projects:
```shell
npm install @rrweb/record @rrweb/replay
```
```js
import { record } from '@rrweb/record';
import { Replayer } from '@rrweb/replay';
import '@rrweb/replay/dist/style.css';
```
Convenience single-package option:
```shell
npm install @rrweb/all
```
```js
import { record, Replayer, pack, unpack } from '@rrweb/all';
import '@rrweb/all/dist/style.css';
```
Legacy compatibility package:
```shell
npm install rrweb
```
```js
import { record, Replayer } from 'rrweb';
import 'rrweb/dist/style.css';
```
### 2) Browser Without Bundler (ESM)
```html
```
Use `current` for the latest stable release, or pin exact versions such as
`https://cdn.rrweb.com/record/2.0.0/dist/record.js` and
`https://cdn.rrweb.com/replay/2.0.0/dist/replay.js` for immutable
production URLs.
### 3) Legacy Direct `
```
## Sponsors
[Become a sponsor](https://opencollective.com/rrweb#sponsor) and get your logo on our README on Github with a link to your site.
### Gold Sponsors 🥇
## Core Team Members
