updated browser profiling screenshots and aggregate flow#37119
Open
brantigua wants to merge 2 commits into
Open
updated browser profiling screenshots and aggregate flow#37119brantigua wants to merge 2 commits into
brantigua wants to merge 2 commits into
Conversation
This comment has been minimized.
This comment has been minimized.
Contributor
Preview links (active after the
|
Contributor
|
/review |
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
🤖 Automated review by Claude. AI-generated; verify before acting.
Thanks for the doc update — the new screenshots and the expanded "Compare" step are great additions. A few typos and minor copy issues to clean up; nothing blocking, but worth fixing in this PR. The new image filenames also have a misspelling (exprience) that's worth normalizing while you're here.
Reviewed bea71970d73a428f4e8027c8b6951ec8c5b567c7 — workflow run
| {% img src="real_user_monitoring/browser/optimizing_performance/browser_profiler_aggregate_experience.png" alt="Browser profiling aggregate experience." style="width:100%;" /%} | ||
|
|
||
| The Profiling page, found thorugh the top bar navigation, lets you analyze profiling data across sessions in one place. Use it to spot system level patterns, compare top-consuming functions, and prioritize optimizations instead of inspecting profiled sessions one by one. The guided experience walks you through: | ||
| The Profiling page, found thorugh the top bar navigation, lets you analyze and compare profiling data across sessions in one place. Use it to spot system level patterns, compare top-consuming functions, and prioritize optimizations instead of inspecting profiled sessions one by one. The guided experience walks you through: |
Contributor
There was a problem hiding this comment.
Issue: Typo — thorugh should be through. Since this line is already being modified in this PR, worth fixing here.
Suggested change
| The Profiling page, found thorugh the top bar navigation, lets you analyze and compare profiling data across sessions in one place. Use it to spot system level patterns, compare top-consuming functions, and prioritize optimizations instead of inspecting profiled sessions one by one. The guided experience walks you through: | |
| The Profiling page, found through the top bar navigation, lets you analyze and compare profiling data across sessions in one place. Use it to spot system level patterns, compare top-consuming functions, and prioritize optimizations instead of inspecting profiled sessions one by one. The guided experience walks you through: |
| 2. **Select a measurement**: Pick a Core Web Vital, custom vital, or RUM action to dive into. Optionally, filter by RUM attributes such as version or OS, or narrow to a specific distribution such as p95. | ||
| {% img src="real_user_monitoring/browser/optimizing_performance/browser_profiler_aggregate_exprience_step_2.png" alt="Step two of the browser profiling aggregate experience showing which measurement to focus on." style="width:100%;" /%} | ||
|
|
||
| 3. **Compare (Optional)**: Define two groups to compare side by side—for example, different versions, OS types, or percentile ranges—to isolate performance differences between them. |
Contributor
There was a problem hiding this comment.
Style: Double space after the colon, and consider lowercasing (optional) for consistency with conventional doc styling.
Suggested change
| 3. **Compare (Optional)**: Define two groups to compare side by side—for example, different versions, OS types, or percentile ranges—to isolate performance differences between them. | |
| 3. **Compare** (optional): Define two groups to compare side by side—for example, different versions, OS types, or percentile ranges—to isolate performance differences between them. |
| 3. **Compare (Optional)**: Define two groups to compare side by side—for example, different versions, OS types, or percentile ranges—to isolate performance differences between them. | ||
| {% img src="real_user_monitoring/browser/optimizing_performance/browser_profiler_aggregate_exprience_step_3.png" alt="Step three of the browser profiling aggregate experience showing how to compare." style="width:100%;" /%} | ||
|
|
||
| 4. **Investigate slowest functions**: Review which functions consume the most time in the aggregated profile so you can prioritize what to optimize first. Explore the call hierarchy to see how those functions relate and where time is spent across the stack, or if you chose to compare see the differneces between group A and B. |
Contributor
There was a problem hiding this comment.
Issue: Typo differneces → differences, and the final clause needs a comma after compare for readability. The sentence is also doing double duty (slowest functions + call hierarchy + comparison) — consider splitting.
Suggested change
| 4. **Investigate slowest functions**: Review which functions consume the most time in the aggregated profile so you can prioritize what to optimize first. Explore the call hierarchy to see how those functions relate and where time is spent across the stack, or if you chose to compare see the differneces between group A and B. | |
| 4. **Investigate slowest functions**: Review which functions consume the most time in the aggregated profile so you can prioritize what to optimize first. Explore the call hierarchy to see how those functions relate and where time is spent across the stack. If you chose to compare, see the differences between group A and B. |
| 3. **Refine your selection**: Narrow to the most relevant slice of data by percentile or time range so you focus on the worst-performing or most critical segment. | ||
| 4. **Investigate slowest functions**: Review which functions consume the most time in the aggregated profile so you can prioritize what to optimize first. | ||
| 5. **View the flame graph**: Explore the call hierarchy to see how those functions relate and where time is spent across the stack. | ||
| {% img src="real_user_monitoring/browser/optimizing_performance/browser_profiler_aggregate_exprience_step_1.png" alt="Step one of the browser profiling aggregate experience showing which views to select." style="width:100%;" /%} |
Contributor
There was a problem hiding this comment.
Suggestion: The new image filenames (browser_profiler_aggregate_exprience_step_1.png through _step_4b.png) misspell experience as exprience. Note that the parent image added in this same PR uses the correct spelling (browser_profiler_aggregate_experience.png on line 164). Consider renaming the step images for consistency before they're referenced elsewhere — it's easier to fix now than later.
| {% img src="real_user_monitoring/browser/optimizing_performance/browser_profiler_aggregate_exprience_step_3.png" alt="Step three of the browser profiling aggregate experience showing how to compare." style="width:100%;" /%} | ||
|
|
||
| 4. **Investigate slowest functions**: Review which functions consume the most time in the aggregated profile so you can prioritize what to optimize first. Explore the call hierarchy to see how those functions relate and where time is spent across the stack, or if you chose to compare see the differneces between group A and B. | ||
| {% img src="real_user_monitoring/browser/optimizing_performance/browser_profiler_aggregate_exprience_step_4a.png" alt="Step 4 of the browser profiling aggregate experience showing results to compare between groups." style="width:100%;" /%} |
Contributor
There was a problem hiding this comment.
Suggestion: The alt text for step 4a says "showing results to compare between groups," but step 4 in the prose is about investigating slowest functions (with comparison only as an optional follow-up). Consider making the alt text describe what the image actually shows (e.g., the slowest-functions/comparison view) so it matches the surrounding step context for screen-reader users.
- Rename browser_profiler_aggregate_exprience_step_*.png → experience - Fix "differneces" → "differences" in step 4 - Fix "thorugh" → "through" - Fix double space after colon in step 3 - Update hero image alt text to match new screenshot - Standardize step alt text to use numerals consistently
brett0000FF
approved these changes
May 29, 2026
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
2 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.
What does this PR do? What is the motivation?
updated browser profiling screenshots and steps for the aggregate flow
Merge instructions
Merge readiness:
For Datadog employees:
Your branch name MUST follow the
<name>/<description>convention and include the forward slash (/). Without this format, your pull request will not pass CI, the GitLab pipeline will not run, and you won't get a branch preview. Getting a branch preview makes it easier for us to check any issues with your PR, such as broken links.If your branch doesn't follow this format, rename it or create a new branch and PR.
[6/5/2025] Merge queue has been disabled on the documentation repo. If you have write access to the repo, the PR has been reviewed by a Documentation team member, and all of the required checks have passed, you can use the Squash and Merge button to merge the PR. If you don't have write access, or you need help, reach out in the #documentation channel in Slack.
AI assistance
Additional notes