- readsStack Overflow's unanswered questions
- becomesurgency (recency · votes · views) → mass inside ONE conserved budget
- writes
--w--field-attention - you seefresh asks read bold and sink as they age; brightening one literally dims the rest
No canvas is drawn here — the field is invisible; these variables are its only output. Without it you would build: priority tiers, a scoring scheme, and a re-sort on every change.
field-ui · invisible fields · inbox
Attention is a budget.
An inbox is a queue of asks competing for one finite resource: yours. Most inboxes pretend otherwise — every row arrives at full volume, so the real triage happens in your head. These are 42 real unanswered [javascript] questions from Stack Overflow, and here the attention is conserved: the page holds a fixed total, split across every ask by urgency — a blend of recency, votes, and views.
Because the total is fixed, brightening one ask literally dims the rest. Attention also has a place: pin an ask and its card moves into the focus pane, holding a full unit; the remaining budget redistributes across the stream, and you watch the others fade by exactly that much. Unpin it and it returns to its place in the stream. Switch the lens and the same budget re-settles along a different signal. The field is invisible — its only output is type weight, ink, and a left anchor.
size = urgency, recency-leaning — fresh asks pull hardest before they go cold · color = age — cool has waited years, warm arrived this week
- Aa size = this ask's share of the budget
- color = recency (cool old → warm fresh)
- click an ask to pin it — it moves to the focus pane with a full unit; the rest split what's left
- the meter always reads 100% — attention is conserved, never created
- the stream is live — new unanswered asks arrive at the top and the budget renormalizes over the larger field; past 60 unpinned, old asks decay off the bottom — the inbox story, literally
- the ink is live — --w is the server-allocated share and --cat the lens color; --d is the engine's local density (hold an ask and the field gathers) and --field-attention the recipe's eased attention as you scroll. The live channels touch only ink, never the budget.
- 0 votes 33 views
- -1 votes 58 views
- 2 votes 92 views
- -1 votes 160 views
- 21 votes 15.2k views
- 0 votes 49 views
- 15 votes 14.6k views
- 15 votes 13.1k views
- 0 votes 81 views
- 14 votes 8.6k views
- 16 votes 3.6k views
- 16 votes 3.4k views
- 0 votes 57 views
- 16 votes 2.4k views
- 15 votes 3.0k views
- 17 votes 1.1k views
- 0 votes 113 views
- 14 votes 2.4k views
- 15 votes 1.5k views
- 16 votes 834 views
- 14 votes 986 views
- 14 votes 623 views
- 0 votes 109 views
- 7 votes 301 views
- 0 votes 87 views
- -1 votes 116 views
- 3 votes 134 views
- 1 votes 60 views
- -1 votes 122 views
- 1 votes 169 views
- 0 votes 58 views
- 2 votes 221 views
- -2 votes 80 views
- 1 votes 46 views
- 1 votes 139 views
- 0 votes 100 views
- -2 votes 112 views
- -3 votes 173 views
- 1 votes 89 views
- 0 votes 79 views
- 0 votes 132 views
- 1 votes 92 views
How it's built
Every ask is ordinary semantic HTML — an <li> carrying its normalized
signals as data attributes. The page blends them into an urgency score per the active lens,
then renormalizes so the weights always sum to one fixed budget. CSS turns
each weight into type heft, ink, and anchor. The field never invents attention; it only
moves it. On top of that sit live channels the engine writes back every frame —
--d (local density, gathered by data-hot on hover) and
--field-attention (the recipe's eased attention) — which touch only ink, never
the budget. Each ask also declares its askedAt as data-field-at,
so the pipeline's recency lane is grounded in the data's own timestamp:
--field-recency decays against the real clock, not your interaction.
1 — mark each ask as a field body
<!-- the stream list holds a stable id; each ask is a body.
data-feedback: the engine writes --d (live local density) back every frame.
data-hot: hover/focus an ask and the field gathers toward it. -->
<ol id="ix-stream">
<li
data-body="attract"
data-strength="1.21"
data-feedback
data-hot
data-rec="0.91" data-vot="0.25" data-vie="0.14"
data-field-at="1765324800000"
style="--w: 0.51; --cat: hsl(318 74% 64%);"
>
<!-- your ordinary HTML here -->
</li>
</ol>
<!-- data-rec = freshness(askedAt, snapshot) — the
@fundamental-engine/core temporal kernel (half-life 7d).
data-field-at declares askedAt as WORLD TIME, so
the platform grounds its recency lane in the data:
--field-recency = freshness(at, now), live. -->
<!-- the attention meter declares its provenance: a
measurement visual OF the stream list -->
<span class="ix-meter" aria-hidden="true"
data-field-visual-for="#ix-stream"
data-field-visual-role="measurement"
><i></i></span> data-body="attract"— registers as a field participantdata-strength— mass, derived from the allocated weightdata-rec/vot/vie— the normalized signals the lenses re-blend (data-recis thefreshness()kernel overaskedAt)data-field-at— the declared world timestamp; the platform grounds its recency lane in it (--field-recency)data-feedback— opt in to--field-*writebacks (--d)data-hot— hover/focus gathers the field toward this askdata-field-visual-for— the meter's declared provenance
2 — the conserved renormalization, live arrivals included
// recency is the world-time kernel —
// exponential newness, half-life 7 days:
import { freshness } from "@fundamental-engine/core";
rec[i] = freshness(askedAtMs, nowMs, 7 * 86400000);
// fresh lens — the blends differ per lens
u[i] = 0.60·rec + 0.25·votes + 0.15·views
// the fixed total: N items × 0.42
budget = N × 0.42
// scale so the weights SUM to the budget,
// cap each at 1, re-flow capped excess
k = budget / Σ u
w[i] = min(1, u[i] × k) // repeat on the rest
// pins: w = 1, then reallocate
// (budget − pins) over the unpinned
Σ w[i] = budget — always.
// the scoped field runs invisible (renderless)
// and asks for the attention metric lane:
applyRecipe(split, base, {
renderless: true,
extraMetrics: ["attention"],
});
// the pipeline writes --field-attention per ask (eased 0..1) // every 5 min (politely: hidden tabs skip the
// attempt, 3 misses retire the loop, and the
// API's backoff field is honored) — fetch the
// same unanswered-[javascript] feed:
const fresh = items.filter(
(q) => !onPage.has(q.question_id), // dedupe
);
// new asks ENTER THE FIELD as full bodies —
// the exact card contract, marked data-live-item
// (age reads "new": honest, not snapshot-relative)
stream.prepend(...cards);
// N grew, so the budget grows with it —
// conservation stays exact:
budget = N × 0.42; reallocate(); // Σ w = budget
// the scoped field re-binds to the new bodies
field.destroy(); field = applyRecipe(…);
// past 60 unpinned, the oldest decay
// off the bottom — then renormalize again That invariant is the mechanic: the meter reads 100% no matter what you do, because pinning, re-blending, arriving, or decaying can only move attention, not mint it. Arrivals are the same flow end to end: fetch → dedupe → enter the field → renormalize.
3 — CSS reads the weight + the live channels
.ix-item {
/* --w = the server-allocated share (conserved)
--d = live engine density — data-hot gathers it
--field-attention = the recipe's eased attention */
--live: var(--d, 0);
opacity: calc(0.58 + var(--w) * 0.42);
box-shadow: 0 0 calc(var(--live) * 16px) -6px
color-mix(in srgb,
var(--cat) calc(var(--live) * 55%), transparent);
background: color-mix(in srgb, var(--text)
calc(1.5% + var(--w) * 4% + var(--live) * 4%
+ var(--field-attention, 0) * 4%),
transparent);
}
/* the kit touches only ink — never --w;
Σ--w stays pinned to the budget */ This is the engine's attention-budget idea applied to a page: bodies compete for a finite influence pool, and the layout reports each body's share — the same conservation the field runtime applies to particle attention, here written into the type.