Matrix Chart
ProCategory by category with a sized mark, where an empty cell reads as one.
How the field metrics move together
Pearson r across 41,200 real user sessions
FCP and TTFB move together most closely at 0.81, INP tracks JavaScript bytes at 0.68, and layout shift is close to independent of everything except JavaScript bytes. Marks are scaled by area, and a crossing with no mark means: Mirror of the cell across the diagonal. Use the arrow keys to move around the grid and Escape to dismiss the reading. The full data follows as a table.
| Row | LCP | FCP | TTFB | CLS | INP | JS bytes |
|---|---|---|---|---|---|---|
| LCP | 1.00 | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal |
| FCP | 0.78 | 1.00 | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal |
| TTFB | 0.62 | 0.81 | 1.00 | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal |
| CLS | 0.11 | -0.13 | -0.22 | 1.00 | Mirror of the cell across the diagonal | Mirror of the cell across the diagonal |
| INP | 0.34 | 0.22 | 0.17 | 0.29 | 1.00 | Mirror of the cell across the diagonal |
| JS bytes | 0.55 | 0.37 | 0.09 | 0.41 | 0.68 | 1.00 |
Size is the strength, colour is the direction, so nothing rests on hue alone. The names sit on the diagonal because that is the one run of cells with nothing to say: every metric correlates perfectly with itself, and a name there is in its own row and its own column, so any mark can be traced to both. The lower half is the whole matrix: a correlation matrix is symmetric, so this is everything the data has to say.
CI matrix, with the gaps
Mark size is the median job time in minutes
Ubuntu runs all four Node versions, macOS drops 18, Windows runs only 22 and 24, and Alpine runs 22 alone. Windows jobs take roughly three times as long as Ubuntu. Marks are scaled by area, and a crossing with no mark means: Not in the build matrix. Use the arrow keys to move around the grid and Escape to dismiss the reading. The full data follows as a table.
| Row | Ubuntu | macOS | Windows | Alpine |
|---|---|---|---|---|
| Node 18 | 4.2 min | Not in the build matrix | Not in the build matrix | Not in the build matrix |
| Node 20 | 4.1 min | 6.9 min | Not in the build matrix | Not in the build matrix |
| Node 22 | 3.8 min | 6.4 min | 11.4 min | 5.2 min |
| Node 24 | 3.6 min | 6.1 min | 10.8 min | Not in the build matrix |
Six of the sixteen combinations are missing, and that is the interesting part. A heat map has to paint every cell, so it would show those six as the palest colour on the ramp, which reads as a fast job rather than as no job at all.
This component installs from the private registry, which opens with Pro. The command and the one-time setup are shown here once your licence key is in this browser.
6 sections, and every other premium component
The preview above is the real Matrix Chart, running. One purchase opens the sections above on this page and on every other component in the library.