feat: add geographic CWV breakdown chart to tech report drilldown#1220
Merged
tunetheweb merged 2 commits intoHTTPArchive:mainfrom Mar 24, 2026
Merged
Conversation
tunetheweb
reviewed
Mar 23, 2026
tunetheweb
reviewed
Mar 23, 2026
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
Contributor
|
@alonkochba Could we visualize the filter params on the chart too?
|
Contributor
|
There is a similar bar chart on Categories page, just breakdown by technologies. |
alonkochba
changed the title
alonkochba
force-pushed
the
feat/geo-cwv-breakdown-chart
branch
2 times, most recently
from
4de86a0 to
05e140a
Compare
tunetheweb
reviewed
Mar 24, 2026
alonkochba
force-pushed
the
feat/geo-cwv-breakdown-chart
branch
from
f218fba to
dbac947
Compare
Adds a Geographic Breakdown section inside the Core Web Vitals card on the tech report drilldown page. Shows top geographies (plus ALL) by origin count with a Good CWV progress bar and sortable columns. - Bar label and extra columns adapt to selected metric: Overall → Good Core Web Vitals + LCP/INP/CLS columns LCP/FCP/TTFB → Good <metric> bar + the other two load metrics INP/CLS → Good <metric> bar only - Metric selector styled to match existing subcategory-selector pattern - Show all / Show fewer toggle below the table - Table wrapped in table-ui-wrapper for mobile horizontal scroll - Dark mode hover contrast fixed using --table-row-hover variable - Guards against non-array API responses (e.g. 404 error objects) - Respects end date filter; latest data timestamp reflects selected date
alonkochba
force-pushed
the
feat/geo-cwv-breakdown-chart
branch
from
ca6bb41 to
0846d51
Compare
tunetheweb
approved these changes
Mar 24, 2026
Member
tunetheweb
left a comment
tunetheweb
left a comment
There was a problem hiding this comment.
Looking good to merge to me with some wording tweaks.
Thanks for working on this @alonkochba !!!
Co-authored-by: Barry Pollard <barrypollard@google.com>
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.
Fixes #1146
Summary
Adds a Geographic Breakdown section inside the Core Web Vitals card on the tech report drilldown page, showing top geographies by origin count alongside their Core Web Vitals performance.
<metric>bar + the other two load metrics as columns<metric>bar only (no redundant extra columns)table-ui-wrapperfor mobile horizontal scroll--table-row-hovervariableImplementation notes
GeoBreakdownJS class (src/js/techreport/geoBreakdown.js)templates/techreport/components/geo_breakdown.html)geo_breakdownconfig block inconfig/techreport.json(drilldown page)static/css/techreport/techreport.cssscoped to.geo-breakdown-*/geo-breakdownAPI endpoint — no backend changes