Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(replay): Upgrade to rrweb 2.0 #8760

Merged
merged 26 commits into from
Sep 27, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
26 commits
Select commit Hold shift + click to select a range
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions .size-limit.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ module.exports = [
path: 'packages/browser/build/npm/esm/index.js',
import: '{ init, Replay, BrowserTracing }',
gzip: true,
limit: '80 KB',
limit: '90 KB',
},
{
name: '@sentry/browser (incl. Tracing) - Webpack (gzipped)',
Expand Down Expand Up @@ -47,7 +47,7 @@ module.exports = [
name: '@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)',
path: 'packages/browser/build/bundles/bundle.tracing.replay.min.js',
gzip: false,
limit: '250 KB',
limit: '260 KB',
},
{
name: '@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)',
Expand Down Expand Up @@ -77,7 +77,7 @@ module.exports = [
path: 'packages/react/build/esm/index.js',
import: '{ init, BrowserTracing, Replay }',
gzip: true,
limit: '80 KB',
limit: '90 KB',
},
{
name: '@sentry/react - Webpack (gzipped)',
Expand All @@ -93,7 +93,7 @@ module.exports = [
path: 'packages/nextjs/build/esm/client/index.js',
import: '{ init, BrowserTracing, Replay }',
gzip: true,
limit: '100 KB',
limit: '110 KB',
},
{
name: '@sentry/nextjs Client - Webpack (gzipped)',
Expand Down
21 changes: 21 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,27 @@

## Unreleased

### Important Changes

- **feat(replay): Upgrade to rrweb2**

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](https://github.com/getsentry/sentry-javascript/issues/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 |

- "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott

## 7.72.0
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,7 @@ sentryTest(
nodeId: expect.any(Number),
node: {
attributes: {
'aria-label': '** ***** ** **********',
'aria-label': 'An Error in aria-label',
billyvg marked this conversation as resolved.
Show resolved Hide resolved
class: 'btn btn-error',
id: 'error',
role: 'button',
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { expect } from '@playwright/test';
import type { inputData } from '@sentry-internal/rrweb';
import { IncrementalSource } from '@sentry-internal/rrweb';
import type { inputData } from '@sentry-internal/rrweb/typings/types';

import { sentryTest } from '../../../utils/fixtures';
import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 9,
"x": 41,
"y": 18
"y": 18,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 9,
"x": 41,
"y": 18
"y": 18,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 9,
"x": 41,
"y": 18
"y": 18,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 9,
"x": 41,
"y": 18
"y": 18,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 12,
"x": 41,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

are we sure these do not flake 😅

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will double check where these are even used, does seem sus

Copy link
Member Author

@billyvg billyvg Aug 11, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ok I assume rrweb updated something so we get more precision from a quick look at the code, the positions should be coming from the mouse event itself

hasn't flaked so 🤞

"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 12,
"x": 41,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 15,
"x": 157,
"y": 90
"x": 157.13999938964844,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand Down Expand Up @@ -34,8 +34,8 @@
"source": 2,
"type": 0,
"id": 15,
"x": 157,
"y": 90
"x": 157.13999938964844,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -46,7 +46,8 @@
"type": 2,
"id": 15,
"x": 157,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 15,
"x": 157,
"y": 90
"x": 157.13999938964844,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand Down Expand Up @@ -34,8 +34,8 @@
"source": 2,
"type": 0,
"id": 15,
"x": 157,
"y": 90
"x": 157.13999938964844,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -46,7 +46,8 @@
"type": 2,
"id": 15,
"x": 157,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand Down Expand Up @@ -34,8 +34,8 @@
"source": 2,
"type": 0,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -46,7 +46,8 @@
"type": 2,
"id": 12,
"x": 41,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Loading