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_` [...])