Time-to-Result Comparison About Block for React

They are WAYS: a title, the approach, days for the bar, the words the duration is read in (when) and an upkeep line. The scale is the largest days value. Change a duration and that bar, and the scale under the columns, follow. The words "2 days", "6 weeks" and "4 months" are the reading; the days are what the bar uses.

Every bar is that way's days divided by the longest way. Four months is the full bar, six weeks is 42 of those 120 days, and two days is a short mark on the same track. A short bar is still honest because the words beside it say "2 days".

The heading is an h2, and each way is an h3. Time to first result and upkeep are a description list. The bar is hidden, and the duration is read as the words plus the day count on the shared scale, so the length of the bar is not the only source of the fact.

The three columns stack. Each one after the first opens with a top rule, and the bar inside it stays the full width of the column. On a wide screen a hairline with corner marks divides the columns. Nothing scrolls sideways at 320 pixels.

A longer bar is a longer time to the first trustworthy row. It is not a score, and the block does not mark a way with a check or a cross. The upkeep line says what it takes to keep that way running.

The header fades up once on load. The columns do not. With reduced motion the fade is off. Nothing loops.