Today I Learned

2026년 7월

2026-07-08

Mobile pointer gestures and a server image proxy

A day spent stabilizing touch drag/resize and, in an unoptimized environment, cutting transferred bytes with an image proxy

Reworked the drag behavior so dragging by touch doesn't scroll the page along with it
Added a proxy so images ship only the size needed, not the whole original

2026-07-07

Making Nested UI Re-renders O(1) — read-model, external store, and render-count tests

In an immutable-tree editor, editing a single line redrew everything; here's how I first pinned the problem with a test, then cut row and container re-renders with a normalized projection and per-id subscriptions

An immutable tree patch gives ancestors a new ref too, so passing props down triggers O(depth) re-renders — a normalized entry plus per-id subscription can cut it to O(1)
The entry cache must be stabilized by output value-equality, not input ref, and the external store sync must run synchronously at the choke point right before setState

2026-07-06

Bundle Shared Vendor, Cross-Block Selection, Floating-UI Coordinates

webpack splitChunks traps, cross-block range operations in a hybrid editor, selectionchange·scroll anchor patterns, Context subscription separation

Using chunks:all with a fixed name on a catch-all vendor pulls dynamic imports up into a shared chunk.
For cross-block text operations, stateless derivation from getSelection + a single boundary split is safer than range state.

2026-07-03

Perf Is a 3× Median; Prefetch Comes as a Set with Skeletons

Sorting out lab-trace outliers, SSR prefetch query-key alignment, CLS skeleton reservation, and server-injected JSON-LD in one day

A single dev-server Performance trace often has outliers, so before/after must be compared with the median of N reloads.
SSR prefetch is a cache miss if the query key differs from the client by even one character, and it must be treated as a set with skeleton-height reservation, or CLS results.

2026-07-01

Long Lists: flatten → SSR First Slice → virtualizer

A pattern that separates infinite scroll from list virtualization, guarantees first HTML with an SSR static gate, then switches to a virtual list

Infinite scroll controls the data-exposure ceiling; virtualization controls the DOM ceiling — each separately.
Flatten a nested group UI into header/item rows before feeding it to the virtualizer.

2026년 6월

2026-06-28

WebSocket Streaming and LCP Improvement

Measurement, UI, and resource priority learned while streaming partial agent responses and improving landing LCP in parallel

You can stream partial results over WebSocket as well.
The priority of the LCP resource has a large impact on the actual metric.