// the find
max-mapper/yo-yo
A tiny library for building modular UI components using DOM diffing and ES6 tagged template literals
yo-yo is a minimal UI component library that uses tagged template literals to build DOM elements and morphdom to diff-update them in place. It's the primitive layer that powered the choo framework, and it's aimed at developers who want React-like component updates without the React build toolchain. Last commit was in 2020 and the project is effectively frozen.
Real DOM diffing via morphdom instead of a virtual DOM layer means less memory overhead and no synthetic event system to fight. The tagged template literal API requires zero build tooling — works with a plain script tag or browserify, no JSX transform needed. At 4kb minified+gzipped the dependency cost is negligible, making it reasonable to bundle inside a standalone npm component. The 'data down, actions up' pattern is explicit and easy to trace compared to two-way binding frameworks.
Abandoned since 2020 — the choo ecosystem it belongs to has been in maintenance mode for years, and this library predates it being superseded. morphdom only copies a fixed set of DOM properties on update, so anything you attach programmatically (addEventListener, custom properties) gets silently dropped after a yo.update call, which bites people who mix imperative and declarative code. No state management at all — you're wiring up your own re-render loop, which the examples show as a manual callback chain that doesn't scale beyond a few components. The event copying whitelist in update-events.js is a static list of onX attributes; anything not on that list won't survive a diff.