CycleWire v1.0.0
First public release: a zero-dependency engine that makes server-rendered HTML
interactive without hydration.
Added
- Core (
cyclewire):- one delegated listener per event type;
- a strict action registry: loader functions, URLs or import-map specifiers;
data-cw-actionanddata-cw-on-<event>bindings, andmodule#exportnames;- triggers:
load,idle,visible,media:; - intent, visible, idle and load preloading with
modulepreload; - concurrency modes:
drop,restart,latest,parallel; data-cw-once,data-cw-debounce,data-cw-propsanddata-cw-ignore;- a cancelable
cw:runevent, pluscw:doneandcw:error; run(),observe()for shadow roots,fromGlob()for Vite, and a configurable
attribute prefix;- plugins with
setup,context,scan,preloadandloadhooks, and object
registry entries ({ module, … }) that carry options for them.
cyclewire/css: stylesheets that arrive with the actions that need them. With the
styles()plugin, a registry entry lists the CSS its UI needs ({ module, css }); the
CSS is preloaded with the module on intent and applied before the handler runs, inside
shadow roots too.css()loads stylesheets from code.cyclewire/autoand classic-script builds that read
<script type="application/json" data-cyclewire>and exposewindow.CycleWire.cyclewire/dom: context-awarehtmltagged templates, inertfragment()
parsing,swap()andtransition()(View Transitions), Trusted Types support.cyclewire/morph: DOM morphing that keeps elements by id ordata-cw-key,
usesmoveBefore()where available, and preserves focus and user input.cyclewire/signals: signals, computed values, effects, deep reactive stores,
anddata-cw-state/data-cw-store/data-cw-bindactivated lazily from
server-serialized state.cyclewire/bootstrap: the Bootstrap 5 data API (collapse, dropdown, modal,
offcanvas, tab, alert) without Bootstrap's JavaScript.- TypeScript declarations, a development build with warnings, and size budgets in CI.
- Guides and runnable examples for React, Vue and Svelte islands, and for Flatpickr,
SweetAlert2, DataTables and jQuery, tested in Chromium, Firefox and WebKit and live
on GitHub Pages.
Install
npm install cyclewire@1.0.0<script src="https://cdn.jsdelivr.net/npm/cyclewire@1.0.0/dist/cyclewire.global.min.js"
integrity="sha384-/P0Nv08w6uODr1GidxFoywMsI2lyyontoN2RsmmOqEZrsRr+9vj3J3a9o02QDAVZ"
crossorigin="anonymous" defer></script>Subresource Integrity
| File | SRI |
|---|---|
cyclewire.global.min.js |
sha384-/P0Nv08w6uODr1GidxFoywMsI2lyyontoN2RsmmOqEZrsRr+9vj3J3a9o02QDAVZ |
cyclewire.full.global.min.js |
sha384-8kFK9hZruNLQpxVFSwGZBRPcBK+pe4N0JSdmBM+QVc8Wa5ommci0GOce7qGZ2I9E |
cyclewire.min.js |
sha384-X31qtsuoaxJVYY5k2GD4lk19XFk0O5Nu8fXQm56TeheEonStoYnsZT5b//Z5MG/H |
css.min.js |
sha384-vTnod85S0efe61Uvs3XsB0gAfXKMT/HYfBFo6s6GHyxj1U4EPQPL0nwhrPU9Bneg |
dom.min.js |
sha384-ICTUMQQ7LaqK6iPfy2Es/s8phOlVarr/LsaRq0h7KxCXSYXk5ABFk+T6Do54Z4if |
morph.min.js |
sha384-PyzvtzFAPzYgq7PseIkCw5Tq2KjolEqzqfJDGy2V6dOZF4AopytdHriT1rmvYrTP |
signals.min.js |
sha384-dOtCDZzlvzjz8b3/Ys7eet0krjIJKGWv6bw1JKyBU4rMEWly3ZCXQgvQ4mZ8J3Zt |
bootstrap.min.js |
sha384-qPsSltLcezWka0mc/QWCZIsmV9DHOp/gVZiB3W5tVH3ZSqGPZPt4lQ19QCurlx1P |
Full changelog: CHANGELOG.md