`spread()` creates three reactive nodes per element

[ryansolid]

Version: 2.0.0-rc.8 (@solidjs/web), packages/web/src/client.ts ~809 (// TODO: make this better)

spread(node, props, skipChildren) currently sets up (a) a render effect assigning props, (b) a separate one for children when not skipped, and (c) the props-collection memo, on top of a prevProps object per element. Every element rendered through Dynamic, dynamic(), or any component that forwards {...props} to an intrinsic pays this; the compiler only avoids it for statically-known attributes.

Measured

ryansolid/yak-bench, Chromium 4× throttle, @yak/solid PR head on rc.8. btn-variant and compose-1 render the same <button> × 1000; the only difference is dynamic $props (so a memo + spread) versus a static class baked into the template:

	hydrate	mount	SSR inst/s
compose-1 (static)	15.7 ms	9.3 ms	10.0M
btn-variant (spread)	30.4 ms	22.6 ms	2.7M

The styled(Component) cases (tabs, multifile-composition) that go createComponent → omit → {...rest} spread → element are the only ones still slower than React on hydrate (0.45×) and mount (0.63×). Full tables in the perf tracker, #3389.

Proposal

• One render effect per element that owns the diff: iterate the (already collected) prop keys, compare against prevProps, assign changed ones; children handled inside the same effect via insert when present.
• Static fast path when the accessor is a plain object without $PROXY (rc.8 4e730a9 already does the collection half of this): assign once, no effect at all unless a getter is present.
• Keep prevProps off the element when there's nothing reactive to diff against.

Acceptance: a yak-runtime variant that forwards to spread lands within noise of yak's hand-rolled createElementRenderer on btn-variant and tabs in the harness; no change to the hydratable fixtures' output.

[ryansolid]

Correction to the target before anyone builds toward it: this cannot become ONE effect per element.

The children insert has to stay its own reactive node — that effect owns the child subtree (components, memos, effects created while the children getter runs are disposed when it reruns), so folding it into the attribute effect would tear down and rebuild the children on every attribute change.

What does fold is ref: ref() applies the callback untracked with a null owner, so nothing a ref creates is owned by the effect that called it, and re-applying only when the ref's identity changes keeps it from firing on unrelated attribute updates. So the floor is 2 nodes when children flow through the spread, 1 when they don't (skipChildren, i.e. every compiled <div {...p}>jsx</div>, or no children key). A plain object whose children is a data property can also insert without an effect.

Same change carries spread(el, sources[], skipChildren, skip) — the client half of the sources-array form being added to ssrElement — so compiled spreads and libraries stop building a merged props object that is only iterated once.

— Claude via Cursor

[ryansolid]

Landed on `next` via #3419 (`7f6332ae`), with the server side in #3418. `spread()` is two reactive nodes per element when children flow through it and one when they don't — `ref` folds into the attribute effect, children keep their own owned insert — and both `spread()` and `ssrElement` take an array of sources with a skip predicate. CodSpeed: +23% / +17% on the spread benches.

— Claude via Cursor