"Crash Course in CrUX" for the PerfMatters conference, April 2019

CrashCourseInCrUX.md

Crash Course in CrUX

CrUX is the Chrome UX Report from Google. This crash course will take you through everything you need to get the most out of the data.

1. Official Docs

https://developers.google.com/web/tools/chrome-user-experience-report/

2. Guides on web.dev

https://web.dev/fast/chrome-ux-report

• walkthroughs of using CrUX tools

3. CrUX repo

https://github.com/GoogleChrome/CrUX

• CrUX Cookbook
• utils for analyzing CrUX data

4. PageSpeed Insights

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwww.nytimes.com%2F2019%2F03%2F27%2Ftechnology%2Fturing-award-ai.html

• page and origin-level CrUX data
• daily aggregations

5. CrUX Dashboard

https://g.co/chromeuxdash

• historical UX trends
• customizable, shareable, and embeddable dashboard built on Data Studio

6. Test my Site

https://www.thinkwithgoogle.com/feature/testmysite

• mobile domain FCP comparisons
• speed/revenue calculator

7. PageSpeed Insights API

https://developers.google.com/speed/docs/insights/v5/get-started

• runs Lighthouse on the given URL
• returns page and origin-level CrUX data

https://developers.google.com/apis-explorer/#p/pagespeedonline/v5/pagespeedonline.pagespeedapi.runpagespeed

• explore the API without writing code

https://dev.to/chromiumdev/a-step-by-step-guide-to-monitoring-the-competition-with-the-chrome-ux-report-4k1o

• blog post with steps to create a daily monitoring dashboard in Sheets

https://github.com/GoogleChrome/CrUX/tree/master/gs

• example script to monitor CrUX using the PSI API and log to Sheets

https://docs.google.com/spreadsheets/d/1VBHLI7v_07t8iDlagrYgiLaYrKGMTRJRwonZ5I4MPm8/edit?usp=sharing

• demo of v4 API sheet

https://datastudio.google.com/open/1hHb7H3FMe0HanjgpBRh9Cbk1k4QmzUoW

• connect Sheets to Data Studio for prettier data viz

https://docs.google.com/spreadsheets/d/1mFWe_KbO8_MevyzrDyULbB3SQqXiciKlzWJfmyUBneU/edit?usp=sharing

• demo of v5 API sheet

8. BigQuery

https://bigquery.cloud.google.com/project/chrome-ux-report

https://github.com/GoogleChrome/CrUX/tree/master/sql

• "CrUX Cookbook"
• sample recipes