docs: frontend tracing guides + maple-frontend-tracing skill - #1114
Draft
JeremyFunk wants to merge 29 commits into
Draft
JeremyFunk wants to merge 29 commits into
JeremyFunk wants to merge 29 commits into
Conversation
|
Important Draft PR not reviewedDraft PRs are not automatically reviewed by default.
To automatically review draft PRs, update your CodeRabbit configuration: reviews:
auto_review:
drafts: trueThanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
…, copy buttons on blog code blocks
…ceparent fallback in the helper
JeremyFunk
changed the title
…lf-contained framework guides
JeremyFunk
changed the title
…count check in the skill's verify step
…span-shape checks in the skill's verify step
…stro card and detection row
… instance in maple-nextjs-style
…@opentelemetry/api alongside the SDK
…stead of copied glue The guides no longer have customers copy tracing.ts or router glue. Next.js, TanStack, React Router, Vue/Nuxt and SvelteKit use their @maple-dev/browser entries; the generic guide calls MapleBrowser.startNavigation/endNavigation/ traced and serverTiming() directly. Behavior notes and known limits follow the SDK: interrupted navigations, React Router version floors, dedupe inside captureException. Requires @maple-dev/browser 0.10.0.
Steps 4-6 point at the framework entry from each reference, or MapleBrowser.* for other frameworks, and serverTiming() for SSR. The references list the imports, where they go, what stays manual, known limits and checks. Angular and Astro still copy tracing.ts until their entries land.
provideMapleTracing, tracedResolver, MapleErrorHandler and reportAngularError replace the copied router glue and helper, and tracedRender from @maple-dev/browser/angular/server wraps the SSR render. Folds in the entry's behavior: redirects to the URL on screen, interrupted same-URL clicks, and its known limits (matcher routes, failed navigations not marked Error, zone.js stability after resolvers, CDN-cached HTML).
The integration writes data-route and traces page loads, ClientRouter navigations and island load errors, and its middleware adds the ssr span and Server-Timing, skipping cacheable responses. The layout keeps only the init script. Covers wiring by hand and the known limits: Astro 5+, mid-stream errors, <html> within 16 KiB, the SDK chunk on every page, rewrites.
…n FAQ headings The overview names Angular and Astro among the frameworks with an SDK integration, and the generic guide no longer lists Astro as a framework without a guide.
Removes tracing.ts: no reference copies it any more. Angular uses @maple-dev/browser/angular and /angular/server, Astro the maple() integration (or its middleware and client entries by hand).
This branch has not been 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
1 participant
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.
Frontend tracing docs and agent skill, structured like the backend instrumentation guides.
Docs (new "Frontend" group in the Instrumentation section)
/docs/frontend: overview with a trace figure, framework cards, agent quick-setup prompt, what you get, why browser tracing differs/docs/frontend/{tanstack,react-router,nextjs,vue,sveltekit,angular,astro,other}: self-contained guides built on the SDK's framework integrations (@maple-dev/browser/<framework>+/server), plus limits and FAQ/docs/instrumentation; brand marks for the frameworks; sidebar icons via a new optionaliconfrontmatter fieldSkill:
skills/maple-frontend-tracing/SKILL.md(framework-agnostic steps, detection table, verify checks for span shapes and error counts),frameworks/*.md(one per framework +other.md)maple-onboard,maple-nextjs-style(exporter snippet fixed for@vercel/otel2.x) and the AI agents docs pageDepends on the SDK PRs #1128 (server helpers + Next.js), #1129 TanStack, #1130 React Router, #1131 Vue/Nuxt, #1132 SvelteKit, #1133 Angular, #1134 Astro, and a release: the guides say
@maple-dev/browser0.10.0 or later (placeholder until the version is cut). Merge after the release.Verification