Core Web Vitals
Loading Performance
Interactivity
Visual Stability
All Metrics Combined
Visualizing Data
The visualization for Core Web Vitals shows a time-based trend graph that’s colored with green, yellow, and pink. Green is good and pink is not good.
The three core web vitals are represented by a circle, squate and a triangle:
Circle = Largest Contentful Paint (LCP):
Square = Interaction to Next Paint (INP)
Triangle = Cumulative Layout Shift (CLS)
The desktop UI (user interface) shows the trend graph and a summary on the left and a text explanation on the right.
Screenshot Of User Interface
The graph offers a visual snapshot of which direction the core web vitals are moving and an explanation of the kind of trend for each metric.
The three kinds of trends are:
Good And Improving
Good And Stable
Poor And Regressing
Screenshot Showing CWV Performance
A more comprehensive explanation of the data is to the right of the trend graph, with each metric identified by the circle, square, and triangle icons.
Screenshot Of Data Explanation
Loading Performance
Using the left hand navigation to get to the Loading Performance screen shows another trend graph that offers additional metrics related to how fast the site or URL loads.
It offers the following six visualizations:
Largest Contentful Paint (LCP)
First Contentful Paint (FCP)
Time to First Byte (TTFB)
Round Trip Time (RTT)
Navigation Types
Form Factors
Screenshot Of Six Visualization Choices
There’s a toggle next to each choice:
Clicking the toggle shows the trend graph:
The rest of the choices show similar breakdowns of each kind of metric.
The new CrUX Vis tool should be useful to publishers and digital marketers who want to get an accurate measurement of website performance, visualized as a trend. It’s useful for competitior research and for website audits.
Go check it out at:
CrUX Vis
Featured Image by Shutterstock/Krakenimages.com