Repository navigation
perf(sentry): Lazy-load Session Replay after page load - #20538
Draft
coolguyzone wants to merge 1 commit into
Draft
coolguyzone wants to merge 1 commit into
coolguyzone wants to merge 1 commit into
Conversation
Replay was bundled into the first-load Sentry chunk (~140 KiB compressed),
the most expensive script on doc pages in Lighthouse. Init the SDK without
it and add it from the Sentry CDN with lazyLoadIntegration once the window
load event fires. The replay sample rates in Sentry.init still apply.
A dynamic import('@sentry/nextjs') wouldn't split Replay out, because this
file already imports that package statically.
Tradeoffs: replays miss the first moments of a visit, and the CDN request
isn't routed through /sentry-tunnel, so ad blockers that block it leave the
session without Replay.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
DESCRIBE YOUR PR
Session Replay is bundled into the docs site's first-load Sentry chunk, which is about 140 KiB compressed and was the most expensive script on doc pages in Lighthouse (about 770 ms of script time on the Next.js guide, mobile). This PR starts the SDK without Replay and adds it from the Sentry CDN with
Sentry.lazyLoadIntegration('replayIntegration')once the page has loaded. It's the next step after #20278 (Kapa.ai on demand) and #20537 (lazy platform icons).replayIntegrationfromSentry.initinsrc/instrumentation-client.tsloadevent, with the samemaskAllText: falseandblockAllMedia: falseoptions.replaysSessionSampleRateandreplaysOnErrorSampleRatestay inSentry.initand still apply.Why the CDN rather than
import('@sentry/nextjs'): this file already imports@sentry/nextjsdirectly, so a dynamic import of the same package wouldn't move Replay out of the main chunk.Needs sign-off from whoever relies on the docs-site replays. It changes what gets recorded:
/sentry-tunnel, but the CDN script comes frombrowser.sentry-cdn.com, which ad blockers commonly block. Visitors who block it get no replays, though errors and traces still arrive. If that loss is too big, the other option is to bundle@sentry-internal/replayfrom our own origin as a separate chunk, which means adding that internal package as a direct dependency.To check the preview: the main Sentry chunk should no longer contain the Replay code, and a request to
browser.sentry-cdn.com/.../replay.min.jsshould appear after the page loads.IS YOUR CHANGE URGENT?
Help us prioritize incoming PRs by letting us know when the change needs to go live.
Select exactly one option. For deadlines, replace
YYYY-MM-DDwith the due date. You can update this information later by editing the PR description.SLA
Thanks in advance for your help!
PRE-MERGE CHECKLIST
Make sure you've checked the following before merging your changes:
🤖 Generated with Claude Code