// the find
Rich-Harris/ramjet
Morph DOM elements from one state to another with smooth animations and transitions
Ramjet fakes DOM element morphing by cloning both nodes, overlaying the clone of the target onto the source's position, then animating the clone's transform/opacity/border-radius/background back to the target's actual layout. It's the 'app expands from its icon' effect (iOS 8 style), for anyone building UI transitions without a heavier animation framework.
Clone-and-interpolate approach means it works on arbitrary DOM subtrees, not just simple shapes — it has dedicated interpolators for transform matrices, border-radius, and rgba so cross-fades of shape/color are handled explicitly rather than approximated. Prefers CSS animations over rAF/timers so transitions run off the main thread and stay smooth even during JS-heavy work. `overrideClone` gives you an escape hatch to strip problematic nodes (autoplaying video, ids that would collide) from the clone before it's inserted.
Dead since a 2017 last commit — no ES modules, no TypeScript types, and no engagement with a decade of DOM/CSS changes since. The README admits automated testing is 'all but impossible' and ships pixel-diff screenshot fixtures instead of real unit tests, which is a red flag for regressions on upgrade. Cloning the entire subtree (including all descendants) for every transform is expensive for anything non-trivial, and there's no cleanup/cancel API if a transition is interrupted mid-flight by a route change or re-render. Browser support baseline (IE9+) tells you this predates any concept of the modern web platform it'd actually run on today.