Skip to content

Commit 398c6ba

Browse files
authored
feat(replay): Upgrade to rrweb 2.0 (#8760)
This is fully backwards compatible with prior versions of the Replay SDK. The only breaking change that we will making is to not be masking `aria-label` by default. The reason for this change is to align with our core SDK which also does not mask `aria-label`. This change also enables better support of searching by clicks. Another change that needs to be highlighted is the 13% bundle size increase. This bundle size increase is necessary to bring improved recording performance and improved replay fidelity, especially in regards to web components and iframes. We will be investigating the reduction of the bundle size in [this PR](#8815). Here are benchmarks comparing the version 1 of rrweb to version 2 | metric | v1 | v2 | | --------- | ---------- | ---------- | | lcp | 1486.06 ms | 1529.11 ms | | cls | 0.40 ms | 0.40 ms | | fid | 1.53 ms | 1.50 ms | | tbt | 3207.22 ms | 3036.80 ms | | memoryAvg | 131.83 MB | 124.84 MB | | memoryMax | 324.8 MB | 339.03 MB | | netTx | 282.67 KB | 272.51 KB | | netRx | 8.02 MB | 8.07 MB |
1 parent e10748b commit 398c6ba

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+599
-323
lines changed

.size-limit.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ module.exports = [
55
path: 'packages/browser/build/npm/esm/index.js',
66
import: '{ init, Replay, BrowserTracing }',
77
gzip: true,
8-
limit: '80 KB',
8+
limit: '90 KB',
99
},
1010
{
1111
name: '@sentry/browser (incl. Tracing) - Webpack (gzipped)',
@@ -47,7 +47,7 @@ module.exports = [
4747
name: '@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)',
4848
path: 'packages/browser/build/bundles/bundle.tracing.replay.min.js',
4949
gzip: false,
50-
limit: '250 KB',
50+
limit: '260 KB',
5151
},
5252
{
5353
name: '@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)',
@@ -77,7 +77,7 @@ module.exports = [
7777
path: 'packages/react/build/esm/index.js',
7878
import: '{ init, BrowserTracing, Replay }',
7979
gzip: true,
80-
limit: '80 KB',
80+
limit: '90 KB',
8181
},
8282
{
8383
name: '@sentry/react - Webpack (gzipped)',
@@ -93,7 +93,7 @@ module.exports = [
9393
path: 'packages/nextjs/build/esm/client/index.js',
9494
import: '{ init, BrowserTracing, Replay }',
9595
gzip: true,
96-
limit: '100 KB',
96+
limit: '110 KB',
9797
},
9898
{
9999
name: '@sentry/nextjs Client - Webpack (gzipped)',

CHANGELOG.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,27 @@
22

33
## Unreleased
44

5+
### Important Changes
6+
7+
- **feat(replay): Upgrade to rrweb2**
8+
9+
This is fully backwards compatible with prior versions of the Replay SDK. The only breaking change that we will making is to not be masking `aria-label` by default. The reason for this change is to align with our core SDK which also does not mask `aria-label`. This change also enables better support of searching by clicks.
10+
11+
Another change that needs to be highlighted is the 13% bundle size increase. This bundle size increase is necessary to bring improved recording performance and improved replay fidelity, especially in regards to web components and iframes. We will be investigating the reduction of the bundle size in [this PR](https://github.com/getsentry/sentry-javascript/issues/8815).
12+
13+
Here are benchmarks comparing the version 1 of rrweb to version 2
14+
15+
| metric | v1 | v2 |
16+
| --------- | ---------- | ---------- |
17+
| lcp | 1486.06 ms | 1529.11 ms |
18+
| cls | 0.40 ms | 0.40 ms |
19+
| fid | 1.53 ms | 1.50 ms |
20+
| tbt | 3207.22 ms | 3036.80 ms |
21+
| memoryAvg | 131.83 MB | 124.84 MB |
22+
| memoryMax | 324.8 MB | 339.03 MB |
23+
| netTx | 282.67 KB | 272.51 KB |
24+
| netRx | 8.02 MB | 8.07 MB |
25+
526
- "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott
627

728
## 7.72.0

packages/browser-integration-tests/suites/replay/customEvents/test.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ sentryTest(
117117
nodeId: expect.any(Number),
118118
node: {
119119
attributes: {
120-
'aria-label': '** ***** ** **********',
120+
'aria-label': 'An Error in aria-label',
121121
class: 'btn btn-error',
122122
id: 'error',
123123
role: 'button',

packages/browser-integration-tests/suites/replay/fileInput/test.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { expect } from '@playwright/test';
2+
import type { inputData } from '@sentry-internal/rrweb';
23
import { IncrementalSource } from '@sentry-internal/rrweb';
3-
import type { inputData } from '@sentry-internal/rrweb/typings/types';
44

55
import { sentryTest } from '../../../utils/fixtures';
66
import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers';

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 9,
8-
"x": 41,
9-
"y": 18
8+
"x": 41.810001373291016,
9+
"y": 18.479999542236328
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -25,8 +25,8 @@
2525
"source": 2,
2626
"type": 0,
2727
"id": 9,
28-
"x": 41,
29-
"y": 18
28+
"x": 41.810001373291016,
29+
"y": 18.479999542236328
3030
},
3131
"timestamp": [timestamp]
3232
},
@@ -37,7 +37,8 @@
3737
"type": 2,
3838
"id": 9,
3939
"x": 41,
40-
"y": 18
40+
"y": 18,
41+
"pointerType": 0
4142
},
4243
"timestamp": [timestamp]
4344
}

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental-chromium

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 9,
8-
"x": 41,
9-
"y": 18
8+
"x": 41.810001373291016,
9+
"y": 18.479999542236328
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -25,8 +25,8 @@
2525
"source": 2,
2626
"type": 0,
2727
"id": 9,
28-
"x": 41,
29-
"y": 18
28+
"x": 41.810001373291016,
29+
"y": 18.479999542236328
3030
},
3131
"timestamp": [timestamp]
3232
},
@@ -37,7 +37,8 @@
3737
"type": 2,
3838
"id": 9,
3939
"x": 41,
40-
"y": 18
40+
"y": 18,
41+
"pointerType": 0
4142
},
4243
"timestamp": [timestamp]
4344
}

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 9,
8-
"x": 41,
9-
"y": 18
8+
"x": 41.810001373291016,
9+
"y": 18.479999542236328
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -25,8 +25,8 @@
2525
"source": 2,
2626
"type": 0,
2727
"id": 9,
28-
"x": 41,
29-
"y": 18
28+
"x": 41.810001373291016,
29+
"y": 18.479999542236328
3030
},
3131
"timestamp": [timestamp]
3232
},
@@ -37,7 +37,8 @@
3737
"type": 2,
3838
"id": 9,
3939
"x": 41,
40-
"y": 18
40+
"y": 18,
41+
"pointerType": 0
4142
},
4243
"timestamp": [timestamp]
4344
}

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental-chromium

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 9,
8-
"x": 41,
9-
"y": 18
8+
"x": 41.810001373291016,
9+
"y": 18.479999542236328
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -25,8 +25,8 @@
2525
"source": 2,
2626
"type": 0,
2727
"id": 9,
28-
"x": 41,
29-
"y": 18
28+
"x": 41.810001373291016,
29+
"y": 18.479999542236328
3030
},
3131
"timestamp": [timestamp]
3232
},
@@ -37,7 +37,8 @@
3737
"type": 2,
3838
"id": 9,
3939
"x": 41,
40-
"y": 18
40+
"y": 18,
41+
"pointerType": 0
4142
},
4243
"timestamp": [timestamp]
4344
}

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 12,
8-
"x": 41,
9-
"y": 90
8+
"x": 41.810001373291016,
9+
"y": 90.37000274658203
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -25,8 +25,8 @@
2525
"source": 2,
2626
"type": 0,
2727
"id": 12,
28-
"x": 41,
29-
"y": 90
28+
"x": 41.810001373291016,
29+
"y": 90.37000274658203
3030
},
3131
"timestamp": [timestamp]
3232
},
@@ -37,7 +37,8 @@
3737
"type": 2,
3838
"id": 12,
3939
"x": 41,
40-
"y": 90
40+
"y": 90,
41+
"pointerType": 0
4142
},
4243
"timestamp": [timestamp]
4344
}

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental-chromium

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 12,
8-
"x": 41,
9-
"y": 90
8+
"x": 41.810001373291016,
9+
"y": 90.37000274658203
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -25,8 +25,8 @@
2525
"source": 2,
2626
"type": 0,
2727
"id": 12,
28-
"x": 41,
29-
"y": 90
28+
"x": 41.810001373291016,
29+
"y": 90.37000274658203
3030
},
3131
"timestamp": [timestamp]
3232
},
@@ -37,7 +37,8 @@
3737
"type": 2,
3838
"id": 12,
3939
"x": 41,
40-
"y": 90
40+
"y": 90,
41+
"pointerType": 0
4142
},
4243
"timestamp": [timestamp]
4344
}

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 15,
8-
"x": 157,
9-
"y": 90
8+
"x": 157.13999938964844,
9+
"y": 90.37000274658203
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -34,8 +34,8 @@
3434
"source": 2,
3535
"type": 0,
3636
"id": 15,
37-
"x": 157,
38-
"y": 90
37+
"x": 157.13999938964844,
38+
"y": 90.37000274658203
3939
},
4040
"timestamp": [timestamp]
4141
},
@@ -46,7 +46,8 @@
4646
"type": 2,
4747
"id": 15,
4848
"x": 157,
49-
"y": 90
49+
"y": 90,
50+
"pointerType": 0
5051
},
5152
"timestamp": [timestamp]
5253
}

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental-chromium

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 15,
8-
"x": 157,
9-
"y": 90
8+
"x": 157.13999938964844,
9+
"y": 90.37000274658203
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -34,8 +34,8 @@
3434
"source": 2,
3535
"type": 0,
3636
"id": 15,
37-
"x": 157,
38-
"y": 90
37+
"x": 157.13999938964844,
38+
"y": 90.37000274658203
3939
},
4040
"timestamp": [timestamp]
4141
},
@@ -46,7 +46,8 @@
4646
"type": 2,
4747
"id": 15,
4848
"x": 157,
49-
"y": 90
49+
"y": 90,
50+
"pointerType": 0
5051
},
5152
"timestamp": [timestamp]
5253
}

packages/browser-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"source": 2,
66
"type": 1,
77
"id": 12,
8-
"x": 41,
9-
"y": 90
8+
"x": 41.810001373291016,
9+
"y": 90.37000274658203
1010
},
1111
"timestamp": [timestamp]
1212
},
@@ -34,8 +34,8 @@
3434
"source": 2,
3535
"type": 0,
3636
"id": 12,
37-
"x": 41,
38-
"y": 90
37+
"x": 41.810001373291016,
38+
"y": 90.37000274658203
3939
},
4040
"timestamp": [timestamp]
4141
},
@@ -46,7 +46,8 @@
4646
"type": 2,
4747
"id": 12,
4848
"x": 41,
49-
"y": 90
49+
"y": 90,
50+
"pointerType": 0
5051
},
5152
"timestamp": [timestamp]
5253
}

0 commit comments

Comments
 (0)