Show HN: µJS, a 5KB alternative to Htmx and Turbo with zero dependencies
I built µJS because I wanted AJAX navigation without the verbosity of HTMX or the overhead of Turbo. It intercepts links and form submissions, fetches pages via AJAX, and swaps fragments of the DOM. Single <script> tag, one call to `mu.init()`. No build step, no dependencies. Key features: patch mode (update multiple fragments in one request), SSE support, DOM morphing via idiomorph, View Transitions, prefetch on hover, polling, and full HTTP verb support on any element. At ~5KB gzipped, it's smaller than HTMX (16KB) and Turbo (25KB), and works with any backend: PHP, Python, Go, Ruby, whatever. Playground: https://mujs.org/playground Comparison with HTMX and Turbo: https://mujs.org/comparison About the project creation, why and when: https://mujs.org/about GitHub: https://github.com/Digicreon/muJS Happy to discuss the project.
Discussion Highlights (19 comments)
ohghiZai
Would love to see a comparison with Datastar too
recursivedoubts
heya amaury, great library! i have added it to the htmx alternatives page: https://htmx.org/essays/alternatives/#ujs
nattaylor
Reminds me a little of htmz htmz is a minimalist HTML microframework for creating interactive and modular web user interfaces with the familiar simplicity of plain HTML.
majorchord
https://sfconservancy.org/GiveUpGitHub/
ranger_danger
Does it automatically parse JSON responses from servers into objects? This is my one big gripe about htmx, even though the devs and other users keep telling me I shouldn't want that as a feature and that it "doesn't make sense". Sorry if I need to use existing APIs I cannot change.
gaigalas
I like the idea. DOM morphing is nice. I've done this previously with morphdom to AJAXify a purely server-driven backoffice system in a company. I would love something even smaller. No `mu-` attributes (just rely on `id`, `href`, `rel`, `rev` and standard HTML semantics). There's a nice `resource` attribute in RDFa which makes a lot of sense for these kinds of things: https://www.w3.org/TR/rdfa-lite/#h-resource Overall, I think old 2015-era microdata like RDFa and this approach would work very well. Instead of reinventing attributes, using a standard.
oso2k
There’s several other (well) known examples of the use of mujs. There’s Artifex’s interpreter from muPDF. It’s also the basis of several JS related projects: https://mujs.com/ There’s also a lesser known interpreter: https://github.com/ccxvii/mujs And IIRC, there was a CommonJS library of the same name.
pwdisswordfishy
Not to be confused with https://mujs.com/ I guess?
lioeters
Looks useful! I skimmed through the docs and had a question. Is there a mechanism for loading HTML partials that require additional style or script file? And possibly a way to trigger a JS action when loaded? For example, loading an image gallery.
heddycrow
It's about time browsers start supporting something like this natively. Fingers crossed. I'll be checking this out. Any chance you (or anyone) has had a run with this lib + web components? I'd love to hear about it.
captn3m0
I’d like to see a comparison with pjax as well: https://github.com/defunkt/jquery-pjax
josephernest
Nice project, always interesting to see HTMX-inspired frameworks. If you want something even more minimalistic, I did Swap.js: 100 lines of code, handles AJAX navigation, browser history, custom listeners when parts of DOM are swapped, etc. https://github.com/josephernest/Swap.js Using it for a few production products and it works quite well!
scuff3d
I don't do a lot of frontend work, but I'm glad to see more of this stuff popping up. Anything that combats the normal framework insanity is a good thing in my book. And this looks like a really cool idea. The default routing approach is an awesome idea, swapping the entire body by default is also really interesting. It seemed odd to me at first, but the more I thought about it the more it made sense.
jadbox
What's the best way to handle having multiple frontend components respond to events from a single SSE connection from some parent node data provider? Ideally we do not what many SSE connections within a page for each component.. right? Then what's the best practice to handle that single SSE handler on the server and frontend? If that makes sense...
stanfordkid
I'm curious to understand, why would you build your website this way vs. say jQuery. I've never really understood the HTMX ecosystem. Is this just to avoid javascript and replace that with html pages, id's and attributes? It feels like the DOM is a very clear abstraction and scripting is a more powerful way to manipulate it. What do people like or prefer about this approach and paradigm?
h4ch1
Hey, cool library had just a small nitpick/request wrt https://mujs.org/playground Could you please add all sources as tabs? For example in Form (GET) I would really like to see /demos/search-results.html and the same goes for other examples. Thanks!
_HMCB_
Layman’s question: How to avoid the page jumping back to the top in the Playground examples?
gavmor
I really like these sorts of frameworks from an architectural perspective, but what's the use-case? Maybe I'm too SPA-pilled, because to me all the fun of Web development is in providing really fluid, skeuomorphic experiences like those enabled by, eg pragmatic-drag-and-drop[0] or yjs[1]. I just struggle to envision what application benefits from the efficiency that this or htmx offer, but from neither the ultra-interactive, nor the ultra-collaborative. Maybe updating stock ticker prices? Fast-service back-of-house ticketing displays? I would love to feel called to reach for this library. 0. https://github.com/atlassian/pragmatic-drag-and-drop 1. https://github.com/yjs/yjs
swaminarayan
At ~5KB gzipped this is impressively small. What were the biggest features you deliberately left out to keep the size that low?