A/B PREVIEW · ARROW HOVER · 2026-05-09

Dashboard delta arrows — hover affordance

Same six cases as the arrow-glyph A/B (positive-good, positive-bad, negative-good, negative-bad, ambiguous, near-zero). Same numbers, same colours, same glyphs. Only difference: the B-side delta gets a dotted underline + hover tooltip showing prior-period absolute, current absolute, native-unit Δ, and the comparison window.

What's being tested. Whether a hover tooltip on the delta makes the % more readable. The percentage on its own is abstract — +178.2% doesn't say what 178.2% of what looks like. The tooltip anchors the move in the metric's actual unit: "Was 575K, Now 1.6M, Δ +1.0M".

Tooltip content (3 lines). Was X · Now Y (Δ Z) · vs prior 90 days. No rule reminder, no statistical context — earned-its-keep minimalism. The dotted underline + cursor hint signal "more info available" without occupying any pixels.

How to evaluate. Hover over the B-side deltas below. Does the tooltip read fast? Does the dotted underline feel right or noisy? Are the numbers worth the affordance?

1 · Positive-good (Requests)

+178.2% · 90-day vs prior 90-day. Big absolute move; tooltip should make the scale visceral.

Old (no hover)

1.6M Requests↗ +178.2%

New (hover)

1.6M Requests↗ +178.2%

↑ hover the delta

2 · Positive-bad (404s)

+110,671.4% · the absurd number on the dashboard. Tooltip translates "absurd %" into "small base × wave of bot probes".

Old (no hover)

93.0K 404 errors↗ +110671.4%

New (hover)

93.0K 404 errors↗ +110671.4%

↑ hover the delta

3 · Negative-good (CPU time, illustrative)

−12.4% · faster = green. Native unit is microseconds — useful to see the actual µs improvement.

Old (no hover)

623µs CPU time (P90)↘ −12.4%

New (hover)

623µs CPU time (P90)↘ −12.4%

↑ hover the delta

4 · Negative-bad (Cache hit rate)

−92.3% · sharp drop. Tooltip shows the actual percentage points, which is more useful than the % of the % for a ratio metric.

Old (no hover)

4.4% Cache hit rate↘ −92.3%

New (hover)

4.4% Cache hit rate↘ −92.3%

↑ hover the delta

5 · Ambiguous (Bandwidth)

+163.1% grey-neutral metric. Tooltip helps the reader decide what to make of the move (it's their job, not the dashboard's).

Old (no hover)

17.0GB Bandwidth↗ +163.1%

New (hover)

17.0GB Bandwidth↗ +163.1%

↑ hover the delta

6 · Near-zero (Threats blocked)

+0.3% · neutral → grey state. Question: does the hover tooltip still earn its keep when the value is essentially flat?

Old (no hover)

119.5K Threats blocked→ +0.3%

New (hover)

119.5K Threats blocked→ +0.3%

↑ hover the delta

What this tells us. The dotted underline is doing two jobs: signalling "more info" and not adding visual weight to non-hover state. Existing dashboard already uses the dotted-underline pattern on status codes (line 27 of the rendered HTML) — pattern continuity matters. The 3-line tooltip layout reads cleanly because each line answers a different question (what was it, what is it now, what changed by how much, over what window).

Watch items. (a) Touch / mobile — hover doesn't exist on tap-only devices; the tooltip would need :focus via tabindex (already added) or a tap-to-toggle behaviour. (b) Cache hit case uses "pp" (percentage points) for the native delta of a percentage metric — not "%" — to avoid the "% of %" confusion. Worth standardising. (c) On the near-zero case (#6), the tooltip shows Δ +400 which is more honest than "+0.3%" — small in % terms but still a real number.

Recommendation. If the hover reads cleanly, ship by extending delta_html() in dare_cf_analytics.py to emit data-tip="..." with the 3-line format and adding the .delta-hover CSS rule (steal it verbatim from this file). The Python side needs access to prior-window absolute values, which the analytics fetch already has — the deltas function just doesn't currently surface them.