ref(browser): split web vitals integration by logaretm · Pull Request #21210 · getsentry/sentry-javascript

logaretm · 2026-05-28T11:55:58Z

Splits out the web vitals recording logic to its own integration that is added by the browser tracing integration by default.

Closes#21209

linear-code · 2026-05-28T11:56:04Z

JS-2628

github-actions · 2026-05-28T12:05:20Z

size-limit report 📦

Path	Size	% Change	Change
@sentry/browser	27.2 kB	-	-
@sentry/browser - with treeshaking flags	25.65 kB	-	-
@sentry/browser (incl. Tracing)	45.5 kB	+0.56%	+250 B 🔺
@sentry/browser (incl. Tracing + Span Streaming)	47.73 kB	+0.53%	+247 B 🔺
@sentry/browser (incl. Tracing, Profiling)	50.28 kB	+0.08%	+40 B 🔺
@sentry/browser (incl. Tracing, Replay)	84.71 kB	-0.2%	-164 B 🔽
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags	74.33 kB	-0.15%	-105 B 🔽
@sentry/browser (incl. Tracing, Replay with Canvas)	89.4 kB	-0.2%	-177 B 🔽
@sentry/browser (incl. Tracing, Replay, Feedback)	102.1 kB	-0.1%	-98 B 🔽
@sentry/browser (incl. Feedback)	44.36 kB	-	-
@sentry/browser (incl. sendFeedback)	32.02 kB	-	-
@sentry/browser (incl. FeedbackAsync)	37.11 kB	-	-
@sentry/browser (incl. Metrics)	28.27 kB	-	-
@sentry/browser (incl. Logs)	28.51 kB	-	-
@sentry/browser (incl. Metrics & Logs)	29.22 kB	-	-
@sentry/react	29.03 kB	-	-
@sentry/react (incl. Tracing)	47.79 kB	+0.44%	+208 B 🔺
@sentry/vue	32.22 kB	-	-
@sentry/vue (incl. Tracing)	47.4 kB	+0.48%	+225 B 🔺
@sentry/svelte	27.23 kB	-	-
CDN Bundle	29.57 kB	-	-
CDN Bundle (incl. Tracing)	47.95 kB	+0.27%	+126 B 🔺
CDN Bundle (incl. Logs, Metrics)	31.08 kB	-	-
CDN Bundle (incl. Tracing, Logs, Metrics)	49.19 kB	+0.27%	+132 B 🔺
CDN Bundle (incl. Replay, Logs, Metrics)	70.36 kB	-	-
CDN Bundle (incl. Tracing, Replay)	85.33 kB	+0.14%	+114 B 🔺
CDN Bundle (incl. Tracing, Replay, Logs, Metrics)	86.51 kB	+0.15%	+123 B 🔺
CDN Bundle (incl. Tracing, Replay, Feedback)	91.15 kB	+0.08%	+69 B 🔺
CDN Bundle (incl. Tracing, Replay, Feedback, Logs, Metrics)	92.33 kB	+0.11%	+101 B 🔺
CDN Bundle - uncompressed	87.7 kB	-	-
CDN Bundle (incl. Tracing) - uncompressed	144.9 kB	+0.54%	+769 B 🔺
CDN Bundle (incl. Logs, Metrics) - uncompressed	92.19 kB	-	-
CDN Bundle (incl. Tracing, Logs, Metrics) - uncompressed	148.65 kB	+0.52%	+769 B 🔺
CDN Bundle (incl. Replay, Logs, Metrics) - uncompressed	217 kB	-	-
CDN Bundle (incl. Tracing, Replay) - uncompressed	263.76 kB	+0.3%	+772 B 🔺
CDN Bundle (incl. Tracing, Replay, Logs, Metrics) - uncompressed	267.51 kB	+0.29%	+772 B 🔺
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed	277.46 kB	+0.28%	+772 B 🔺
CDN Bundle (incl. Tracing, Replay, Feedback, Logs, Metrics) - uncompressed	281.2 kB	+0.28%	+772 B 🔺
@sentry/nextjs (client)	50.26 kB	+0.42%	+207 B 🔺
@sentry/sveltekit (client)	45.92 kB	+0.47%	+213 B 🔺
@sentry/core/server	75.94 kB	-	-
@sentry/core/browser	63.09 kB	-	-
@sentry/node-core	61.7 kB	+0.01%	+1 B 🔺
@sentry/node	130.4 kB	+0.01%	+1 B 🔺
@sentry/node - without tracing	74.06 kB	+0.01%	+1 B 🔺
@sentry/aws-serverless	86.26 kB	+0.01%	+1 B 🔺
@sentry/cloudflare (withSentry) - minified	173.59 kB	-	-
@sentry/cloudflare (withSentry)	433.61 kB	-	-

View base workflow run

Lms24 · 2026-05-29T12:48:12Z

+ /**
+ * Web vitals to skip.
+ */
+ disable?: WebVitalName[];


I like this API much more than the enableInp flag we had in browserTracingIntegration. Just wondering if we should have a different name for this because we rarely use disable as an option. WDYT about ignore? Kinda goes with the same "denylist" pattern but is a bit more established in our options.
I was also thinking if instead of the "disable" mentality, we should have an enable: WebVitalName[] option that by default includes everything. But then I realized, if users set this to e.g. disable INP but have LCP and CLS, they'd never get a new vital we'd add here (soft nav vitals) unless they explicitly add it. So I think the denylist approach in this case is better suited.

ignore works better here and similar to other stuff we have

Lms24 · 2026-05-29T12:54:17Z

I think one thing where browserTracing and webVitalsIntegration are still a bit interwoven is the addPerformanceEntries call where we write the web vitals as measurements onto the pageload span. We would still need this code if v11 ships with transactions and span streaming (most likely). Do you think it makes sense for us to also pull this out of browserTracing?
I guess one can make the argument that since this requires the pageload span to be present, it can also live in browserTracing. So in a way this is already a separation of concerns. No strong opinions!

I think pageload is the transport only in this case, so ideally we should move it out. It is too tightly coupled to the other stuff collected like fp/fcp, do you think we can maybe have it its own performance observer loop so we can split them out?

do you think we can maybe have it its own performance observer loop so we can split them out?
How do you mean that? Collect what we collect in _measurements in webVitalsIntegration? Yeah I think we could do that.

Yea sorry, I decided to move FP/FCP as well later so there should be no measurements left to collect on the browser tracing integration, it's all now in web vitals integration. That comment was outdated.
The only coupled part is the collectWebVitals call which I want to get rid of now and move away from tracing integration. Doing that now since I think it is within the scope of this PR.
Sorry for the back and forth.

Co-Authored-By: Codex <codex@openai.com>

Aligns the webVitalsIntegration denylist option with the more established `ignore` naming used elsewhere in our options. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Previously `addPerformanceEntries` (driven by `browserTracingIntegration`) both emitted pageload child spans (resource/navigation/measure) *and* wrote the web vital values onto the pageload span. This interleaved web vital logic with browserTracing's transport concerns. This fully consolidates web vital logic into `webVitalsIntegration`: - FP/FCP are now collected via their own `paint` PerformanceObserver in `startTrackingWebVitals`, instead of being scavenged from the shared `addPerformanceEntries` loop. All six vitals are now collected in one place. - The "write vitals onto the pageload span" block is extracted into a new `addWebVitalsToSpan` helper, which the integration drives via `collectWebVitalsForClient(client, span)` at span end. The integration owns the decision of whether/how to record each vital. - `connection.rtt` is decoupled from the web vital measurement flush and emitted directly by `_trackNavigator` (behavior-preserving: `setMeasurement` in v1, span attribute in span streaming). - `addPerformanceEntries` slims to resource/navigation/measure spans + navigator; its `_performanceCursor` is no longer shared with web vitals. `browserTracingIntegration` now only provides the pageload span and the span-end trigger — it makes no web vital decisions.

The web vital refactor moved `connection.rtt` out of the shared `_measurements` object and emitted it directly via `setMeasurement` in `_trackNavigator`. Since `_trackNavigator` runs from `addPerformanceEntries` for every idle span (pageload and navigation), this regressed `connection.rtt` onto navigation transactions too. Previously it was only flushed inside the `op === 'pageload'` guard. Restore the pageload-only scope for the non-streaming measurement (the span-streaming attribute path was already emitted for all spans and is unchanged) and add a navigation regression test.

Co-Authored-By: OpenAI GPT-5 <codex@openai.com>

github-actions · 2026-06-02T11:36:24Z

👋 @mydea — Please review this PR when you get a chance!

Lms24

Gonna approve this since I think we can either merge this as-is and pull out more measurements collecting stuff in a follow-up (if this is easily doable, otherwise feel free to disregard).

Co-Authored-By: OpenAI GPT-5 <codex@openai.com>

cursor

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 1b58aa7. Configure here.}

Co-Authored-By: OpenAI GPT-5 <codex@openai.com>

logaretm requested a review from a team as a code owner May 28, 2026 11:55

logaretm requested review from Lms24 and mydea and removed request for a teamMay 28, 2026 11:56

logaretm force-pushed the awad/js-2628-split-web-vitals-into-their-own-integration branch 2 times, most recently from 99e8359 to 433f30aCompare May 28, 2026 12:10

cursorBot reviewed May 28, 2026
View reviewed changes

Comment threadpackages/browser/test/integrations/webVitals.test.ts

Lms24 reviewed May 29, 2026
View reviewed changes

logaretm force-pushed the awad/js-2628-split-web-vitals-into-their-own-integration branch from 0eccc6c to fb0e9d0Compare May 29, 2026 21:57

cursorBot reviewed May 29, 2026
View reviewed changes

Comment threadpackages/browser-utils/src/metrics/browserMetrics.ts

cursorBot reviewed May 29, 2026
View reviewed changes

Comment threaddev-packages/browser-integration-tests/suites/tracing/metrics/connection-rtt-navigation/test.ts Outdated

logaretmand others added 4 commits June 1, 2026 11:12

feat(browser): split web vitals integration
d38a93d
Co-Authored-By: Codex <codex@openai.com>

refactor(browser): rename web vitals disable option to ignore
0bdd0dc
Aligns the webVitalsIntegration denylist option with the more established `ignore` naming used elsewhere in our options. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

logaretm force-pushed the awad/js-2628-split-web-vitals-into-their-own-integration branch from 98a76d7 to 00cd99bCompare June 1, 2026 15:12

logaretm requested a review from Lms24 June 1, 2026 15:13

cursorBot reviewed Jun 1, 2026
View reviewed changes

Comment threadpackages/browser/src/tracing/browserTracingIntegration.ts
Comment threadpackages/browser-utils/src/metrics/browserMetrics.ts

sentryBot reviewed Jun 1, 2026
View reviewed changes

Comment threadpackages/browser/src/tracing/browserTracingIntegration.ts Outdated

fix(browser-utils): reset web vital state on unavailable performance API
46421eb
Co-Authored-By: OpenAI GPT-5 <codex@openai.com>

logaretm changed the title ~~feat(browser): split web vitals integration~~ref(browser): split web vitals integrationJun 2, 2026

Lms24 approved these changes Jun 3, 2026
View reviewed changes

Comment threaddev-packages/browser-integration-tests/suites/tracing/metrics/connection-rtt-navigation/test.ts Outdated

logaretmand others added 3 commits June 3, 2026 14:15

test(browser): wait for connection rtt transactions
fe17013
Co-Authored-By: OpenAI GPT-5 <codex@openai.com>

ref(browser): let web vitals own pageload flush
330c75d
Co-Authored-By: OpenAI GPT-5 <codex@openai.com>

ref(browser): flush web vitals from span end event
1b58aa7
Co-Authored-By: OpenAI GPT-5 <codex@openai.com>

cursorBot reviewed Jun 3, 2026
View reviewed changes

Comment threadpackages/browser-utils/src/metrics/browserMetrics.ts

fix(browser-utils): attach web vital measurements to provided span
a60615a
Co-Authored-By: OpenAI GPT-5 <codex@openai.com>

Lms24 approved these changes Jun 3, 2026
View reviewed changes

logaretm merged commit 983fbac into developJun 3, 2026
526 of 529 checks passed

logaretm deleted the awad/js-2628-split-web-vitals-into-their-own-integration branch June 3, 2026 19:49

sentry-release-botBot mentioned this pull request Jun 9, 2026
publish: getsentry/sentry-javascript@10.57.0 getsentry/publish#8495
Closed
48 tasks

github-actionsBot mentioned this pull request Jun 9, 2026
Split Web Vitals into their own integration #21209
Closed

Uh oh!

Uh oh!

Conversation

logaretm commented May 28, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

linear-codeBot commented May 28, 2026

Uh oh!

github-actionsBot commented May 28, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

size-limit report 📦

Uh oh!

Uh oh!

Lms24May 29, 2026

Choose a reason for hiding this comment

Uh oh!

logaretmMay 29, 2026

Choose a reason for hiding this comment

Uh oh!

Lms24May 29, 2026

Choose a reason for hiding this comment

Uh oh!

logaretmMay 29, 2026

Choose a reason for hiding this comment

Uh oh!

Lms24Jun 3, 2026

Choose a reason for hiding this comment

Uh oh!

logaretmJun 3, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

github-actionsBot commented Jun 2, 2026

Uh oh!

Lms24 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

cursorBot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

logaretm commented May 28, 2026•
edited
Loading

github-actionsBot commented May 28, 2026•
edited
Loading

logaretmJun 3, 2026•
edited
Loading