docs(clickstack): rewrite Event deltas around 24h regression-onset hero#6149
Draft
alex-fedotyev wants to merge 5 commits intomainfrom
Draft
docs(clickstack): rewrite Event deltas around 24h regression-onset hero#6149alex-fedotyev wants to merge 5 commits intomainfrom
alex-fedotyev wants to merge 5 commits intomainfrom
Conversation
…and tips Reframes comparison mode around two concrete use cases (anomaly cluster and slow vs fast) with annotated payment-service screenshots from the ClickStack demo, demotes the third selection shape into a smaller subsection, and adds a "Tips for effective use" section plus example scenarios for the heatmap settings drawer.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
3 Skipped Deployments
|
|
|
…s-fast around systemic analysis Refreshes the four Event deltas screenshots from the ClickStack demo to surface clearer stories: the overview now uses the payment service over six hours so the slow-band density visibly increases across the timeline (bimodal), and the slow-vs-fast comparison switches to the accounting service where the slow and fast bands are systemically identical for every tracked attribute. Reframes "Use case 2: Slow versus fast" to make the systemic finding explicit: a flat comparison (no attribute differs between Selection and Background) is itself a useful verdict, pointing at infrastructure causes (GC, I/O contention, scheduler, cold cache) rather than a code-path difference. Updates the alt text and example narration on all four images, and drops the "click Filter by Selection to enter comparison mode" wording (the UI auto-engages comparison on drag release).
…modal hero Recaptures all five Event deltas screenshots in dark theme and shifts the payment overview to a twelve-hour window so the bimodal pattern is the hero (a dense fast bulk plus a slower tail) and the slow-tail density visibly grows across the timeline (good early, getting worse later). Anomaly-box now selects the right-edge cluster on that twelve-hour view and surfaces a richer set of divergent payment attributes (risk.3ds_enrolled, security.encryption ecdhe-p256, decline_reason velocity-exc, security.mfa_verified). Slow-vs-fast keeps the accounting bimodal split and the systemic-cause framing. Drill-down captures the actual click popover (webhook.endpoint_count = 3, Selection 20.7% vs Background 19.3%) with the Filter, Exclude, Copy action icons. Settings drawer is renamed to Display Settings to match the current UI.
…d reframe use case 1 as before-vs-after Reshoot every screenshot in the Event deltas page on a single payment service over a twenty-four hour window. The new hero shows the distinctive shape Event deltas is built to find: latency that is steady through the morning and visibly drifts upward through the afternoon and evening, ending with the bulk of spans an order of magnitude slower than they started. That progressive degradation gives the page a much stronger opening than the previous bimodal twelve-hour shot. Match the storyline: - Promote before-vs-after to use case 1 with a full-height vertical strip selection over the right portion of the timeline. The comparison surfaces ScopeVersion 0.57.2 (Selection-biased) against 0.1.0 (Background-biased), payment.tokenization_method apple-pay-token (Selection-biased), and transaction.installments 1 versus 12, the fingerprint of a deployment that introduced a new instrumentation library and altered which payment paths the service exercises. - Keep slow-vs-fast as use case 2 on a different service whose heatmap separates cleanly into two horizontal bands; reshot at twenty-four hours so it visually rhymes with the hero. - Demote the localized-anomaly-cluster shape into the "Other selection shapes" list and drop its dedicated screenshot. With the hero now a classic regression-onset pattern, before-vs-after is the natural primary use case; the localized-cluster framing is a secondary tool rather than the headline shape. - Drop em-dashes throughout the page (definition-list bullets now use colons), update legend wording from red to orange to match the product, and rewrite the closing line under "Other selection shapes" as a one-sentence map from shape to question. Reshoot the drill-down popover on the ScopeVersion 0.57.2 bar so the illustrated divergence (Selection 53.9% / Background 49.5%) lines up with the surrounding before-vs-after example. Reshoot the Display Settings drawer in dark theme. All screenshots are 1600x1000, dark theme, captured by walking the flow end to end in Playwright.
alex-fedotyev
changed the title
Blargian
approved these changes
May 5, 2026
Co-authored-by: Shaun Struwig <41984034+Blargian@users.noreply.github.com>
Contributor
Author
|
Waiting for hyperdxio/hyperdx#2189 to land, then need to retake screenshots |
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
3 participants
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.
Summary
Follow-up to #6114. Reshoots every screenshot in the Event deltas page on a single payment service over a twenty-four hour window. The new hero shows the distinctive shape Event deltas is built to find: latency that is steady through the morning and visibly drifts upward through the afternoon and evening, ending with the bulk of spans an order of magnitude slower than they started.
That progressive-degradation hero motivates a tighter use-case structure:
ScopeVersion 0.57.2(Selection-biased) against0.1.0(Background-biased),payment.tokenization_method = apple-pay-token(Selection-biased), andtransaction.installments = 1versus12. Read together, these are the fingerprint of a deployment that introduced a new instrumentation library and altered which payment paths the service exercises.The drill-down popover is reshot on the
ScopeVersion 0.57.2bar so the illustrated divergence (Selection 53.9% / Background 49.5%) lines up with the surrounding before-vs-after example. The Display Settings drawer is reshot in dark theme.Also drops em-dashes throughout the page (definition-list bullets now use colons), updates legend wording from "red" to "orange" to match the product, and rewrites the closing line under "Other selection shapes" as a one-sentence map from shape to question.
All screenshots are 1600x1000, dark theme, captured by walking the flow end to end in Playwright (filter to one
ServiceName, switch to Event Deltas, drag a selection on the canvas, hover near a corner of the selection so the dashed selection rectangle stays drawn, then capture).Test plan
yarn start: verify/docs/use-cases/observability/clickstack/event_deltasrenders#before-vs-after,#slow-vs-fast,#other-shapes,#tipsresolve