Core concepts
Fragments
A VFrag groups sibling nodes without a wrapper element in the DOM. Fragments participate in keyed reconciliation.
Inspired by React's Fragment (<></>), a VFrag is analogous to the browser's DocumentFragment:
-- Renders two <li> elements as direct
-- siblings, no enclosing element
fragment
[ H.li_ [] [ "Item A" ]
, H.li_ [] [ "Item B" ]
]
-- Keyed fragment — survives reordering
-- without full teardown / remount
vfrag_ "my-key"
[ H.li_ [] [ "Item A" ]
, H.li_ [] [ "Item B" ]
]Fragments may be nested. The differ recurses into nested fragments and processes them as if they were a flat sequence of sibling DOM nodes, so nesting carries no runtime cost beyond the constructor allocation. Empty fragments in child lists are erased before diffing and are therefore a no-op.
fragment- unkeyed fragment
vfrag- unkeyed fragment (alias)
fragment_- keyed fragment
vfrag_- keyed fragment (alias, infix-friendly:
"key" `vfrag_` [...])