Swap & Morph Example

Purpose: Demonstrates updating DOM content with put (into, before, after, at start/end of) and morph. (hyperfixi 3.x spelled the positions swap innerHTML of X with Y; in 4.0, as upstream, swap A with B exchanges two values.)
put morph DOM updates

Original Content

This content will be swapped/morphed.

Morph vs innerHTML Comparison

Morph (preserves state)

innerHTML (destroys state)

Position Swaps (Strategies List)

Click buttons to add cards to the strategies list:

Delete Elements

Card 1
Card 2
Card 3

Legacy Position Swaps

Item 1
Item 2
Item 3

Debug Log

Waiting for actions...