Streaming Log Follow

Overview

Type lines with stepped keyframes on the scene clock. When content exceeds the viewport, lerp the scroller toward the newest line.

Build

1. 01

   Stepped typewriter keyframe per line, delayed from the scene start.

2. 02

   Measure content height vs viewport.

3. 03

   Lerp scrollY toward the tail.

4. 04

   Optional fade of the scene at the end.

el.addFrameTask((t) => {
  const y = lerp(y, contentH(t) - viewH, 0.35)
})