← all recipes

"Latency Ripple" — show delay, loading, sync, and distributed system response as waves. It has a propagate layer (travelling waves through the medium), a diffuse layer (spread a quantity over the medium), a fieldflow layer (solar prominences, aurora, plasma streams, guided matter), and a memory layer (a decaying trail / hysteresis). Matter follows the field geometry because of fieldflow, not the field-owning force itself. The active render stack is streamlines, field-lines, particles, trails.

A signal propagates outward and fieldflow carries it to affected regions; diffuse damps slow or blocked areas so delay reads as distance, not a spinner.

Runtime tokens

propagate diffuse fieldflow memory

Concepts

ripple

Metrics

latency signal damping sync latency, signal, damping, sync are host-supplied lanes — drive them with data-field-<metric> (or a domain model); without that, their --field-* stays inert.

Diagnostics

contours force-vectors prediction

Render

streamlines · field-lines · particles · trails

Reduced motion

a sync timeline with an affected-region list and latency badges

Without motion

delay becomes a per-region latency badge and a timeline rather than a traveling wave

<field-root></field-root>
  <div data-body="propagate" data-strength="1" data-range="400" data-feedback></div>
  <div data-body="diffuse" data-strength="0.7" data-range="320"></div>
  <div data-body="fieldflow" data-strength="0.6" data-range="0"></div>
  <div data-body="memory" data-strength="0.5" data-range="280"></div>