Skip to content

Conversation

@onurtemizkan
Copy link
Collaborator

@onurtemizkan onurtemizkan commented Oct 17, 2025

Fixes an issue where pageload and navigation transactions have incorrect (URL-based or wildcard-based) names when the span is cancelled early before lazy routes finish loading.

This occurs when document.hidden triggers early span cancellation (e.g., user switches tabs during page load). In React Router applications with lazy routes, the parameterized route information may not be available yet when the span ends, resulting in transaction names like /user/123/edit (URL-based) or /projects/*/views/* (wildcard-based) instead of the correct parameterized route like /user/:id/edit or /projects/:projectId/views/:viewId.

This fix patches span.end() to perform a final route resolution check before the span is sent, using the live global allRoutes Set to capture any lazy routes that loaded after the span was created but before it ended.

@onurtemizkan onurtemizkan force-pushed the onur/react-router-cancelled-lazy-pageloads branch 3 times, most recently from a09c3a7 to 03e62e7 Compare October 17, 2025 10:34
@onurtemizkan onurtemizkan changed the title fix(react): Patch spanEnd for potentially cancelled lazy-route pageloads fix(react): Patch spanEnd for potentially cancelled lazy-route transactions Oct 17, 2025
@onurtemizkan onurtemizkan force-pushed the onur/react-router-cancelled-lazy-pageloads branch from 03e62e7 to 7c622f8 Compare October 17, 2025 13:13
@github-actions
Copy link
Contributor

github-actions bot commented Oct 17, 2025

size-limit report 📦

Path Size % Change Change
@sentry/browser 24.63 kB - -
@sentry/browser - with treeshaking flags 23.11 kB - -
@sentry/browser (incl. Tracing) 40.97 kB - -
@sentry/browser (incl. Tracing, Profiling) 45.26 kB - -
@sentry/browser (incl. Tracing, Replay) 79.29 kB - -
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags 68.97 kB - -
@sentry/browser (incl. Tracing, Replay with Canvas) 83.99 kB - -
@sentry/browser (incl. Tracing, Replay, Feedback) 96.16 kB - -
@sentry/browser (incl. Feedback) 41.3 kB - -
@sentry/browser (incl. sendFeedback) 29.29 kB - -
@sentry/browser (incl. FeedbackAsync) 34.22 kB - -
@sentry/react 26.31 kB - -
@sentry/react (incl. Tracing) 42.97 kB - -
@sentry/vue 29.11 kB - -
@sentry/vue (incl. Tracing) 42.75 kB - -
@sentry/svelte 24.64 kB - -
CDN Bundle 26.9 kB - -
CDN Bundle (incl. Tracing) 41.62 kB - -
CDN Bundle (incl. Tracing, Replay) 77.87 kB - -
CDN Bundle (incl. Tracing, Replay, Feedback) 83.35 kB - -
CDN Bundle - uncompressed 78.86 kB - -
CDN Bundle (incl. Tracing) - uncompressed 123.44 kB - -
CDN Bundle (incl. Tracing, Replay) - uncompressed 238.48 kB - -
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed 251.24 kB - -
@sentry/nextjs (client) 45.11 kB - -
@sentry/sveltekit (client) 41.4 kB - -
@sentry/node-core 50.75 kB +0.01% +1 B 🔺
@sentry/node 156.91 kB - -
@sentry/node - without tracing 92.61 kB +0.01% +1 B 🔺
@sentry/aws-serverless 106.33 kB - -

View base workflow run

@onurtemizkan onurtemizkan force-pushed the onur/react-router-cancelled-lazy-pageloads branch 2 times, most recently from 20d8466 to 3345b67 Compare October 20, 2025 13:54
@github-actions
Copy link
Contributor

github-actions bot commented Oct 20, 2025

node-overhead report 🧳

Note: This is a synthetic benchmark with a minimal express app and does not necessarily reflect the real-world performance impact in an application.

Scenario Requests/s % of Baseline Prev. Requests/s Change %
GET Baseline 8,906 - 8,670 +3%
GET With Sentry 1,431 16% 1,343 +7%
GET With Sentry (error only) 6,258 70% 6,020 +4%
POST Baseline 1,204 - 1,173 +3%
POST With Sentry 561 47% 499 +12%
POST With Sentry (error only) 1,078 90% 1,047 +3%
MYSQL Baseline 3,349 - 3,280 +2%
MYSQL With Sentry 504 15% 425 +19%
MYSQL With Sentry (error only) 2,749 82% 2,670 +3%

View base workflow run

@onurtemizkan onurtemizkan force-pushed the onur/react-router-cancelled-lazy-pageloads branch from 5ac0764 to e7270bc Compare October 20, 2025 15:13
@onurtemizkan onurtemizkan marked this pull request as ready for review October 20, 2025 16:05
* Patches the span.end() method to update the transaction name one last time before the span is sent.
* This handles cases where the span is cancelled early (e.g., document.hidden) before lazy routes have finished loading.
*/
function patchSpanEnd(
Copy link
Member

Choose a reason for hiding this comment

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

We have client.on("spanEnd"). Is it possible to use it here? Then it would be more transparent and aligned with the other implementations.

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

I think that's not usable in this case, as we need to update the span name/source right before it ends. Looks like client.on('spanEnd') runs when the span is not mutable anymore.

cursor[bot]

This comment was marked as outdated.

@s1gr1d s1gr1d merged commit fd26569 into develop Oct 23, 2025
90 of 92 checks passed
@s1gr1d s1gr1d deleted the onur/react-router-cancelled-lazy-pageloads branch October 23, 2025 14:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants