{"slug": "morphdom", "name": "morphdom", "category": "dev-libs", "category_name": "Libraries and frameworks", "description": "", "recommenders": 3, "commenters": 6, "warners": 1, "score": 1.694, "rising": -0.98, "first": "2025-12-20", "latest": "2026-10-04", "why": "I use Morphdom to just do a diff on the main section of the page.", "why_is_quote": true, "has_verdict": false, "sentiment": {"recommend": 3, "neutral": 3, "compare": 0, "warn": 1}, "spark": [0, 1, 0, 0, 1, 0, 0, 0, 1, 0, 0, 0], "listed": true, "loved": [], "caveat": "", "short_quote": "I use Morphdom to just do a diff on the main section of the page.", "kind": "", "icon": false, "domain": null, "github_repo": "github.com/patrick-steele-idem/morphdom", "official_url": "https://github.com/patrick-steele-idem/morphdom", "pricing": "", "aliases": ["morphdom", "Morphdom"], "verdict": null, "praise": [{"label": "", "summary": "", "quotes": [{"id": 785168417, "item_id": 49073026, "url": "https://news.ycombinator.com/item?id=49073026", "by": "christophilus", "date": "2026-07-27", "stance": "recommend", "quote": "DOM morphing seems like it\u2019s probably a good solution to this", "excerpt": "I haven\u2019t used it with htmx, but DOM morphing seems like it\u2019s probably a good solution to this. https://v1.htmx.org/extensions/morphdom-swap/", "context": "", "use_case": "", "switched_from": "", "story": "Removing React.js from the codebase and adapting Htmx for UI interactivity"}, {"id": 756631328, "item_id": 47289458, "url": "https://news.ycombinator.com/item?id=47289458", "by": "gaigalas", "date": "2026-03-07", "stance": "recommend", "quote": "I've done this previously with morphdom to AJAXify a purely server-driven backoffice system in a company.", "excerpt": "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 Overa", "context": "", "use_case": "DOM morphing for AJAX", "switched_from": "", "story": "Show HN: \u00b5JS, a 5KB alternative to Htmx and Turbo with zero dependencies"}, {"id": 742049185, "item_id": 46378074, "url": "https://news.ycombinator.com/item?id=46378074", "by": "nymanjon", "date": "2025-12-24", "stance": "recommend", "quote": "morphdom/idiomorph get you a long way", "excerpt": "HTMX and related libs work just fine as offline apps. I've been doing it with my personal apps I make for myself for a long time. Also, morphdom/idiomorph get you a long way even when you have highly interactive pages, especially if you have to hit the back end anyways. If you don't need to hit the back end then a front end lib is fine. But even then, the simpler pattern of hypermedia-driven applications can be bette", "context": "", "use_case": "", "switched_from": "", "story": "Please just try HTMX"}, {"id": 741483360, "item_id": 46342710, "url": "https://news.ycombinator.com/item?id=46342710", "by": "nymanjon", "date": "2025-12-20", "stance": "recommend", "quote": "I use Morphdom to just do a diff on the main section of the page.", "excerpt": "Here's an example offline-first hypermedia-driven soccer application. The match page is the most complex part of the application and I use Morphdom to just do a diff on the main section of the page. I find hypermedia-driven development to be super simple. I find React to be really complex. What normally takes me just some HTML rendered from the back end and some interactivity on the front end can be done in just a fe", "context": "", "use_case": "DOM diffing", "switched_from": "", "story": "Please just try HTMX"}, {"id": 741483105, "item_id": 46342694, "url": "https://news.ycombinator.com/item?id=46342694", "by": "nymanjon", "date": "2025-12-20", "stance": "recommend", "quote": "I just use morphdom for that part of the app and it makes it super easy", "excerpt": "Interesting read. I haven't quite finished it all. I haven't ever needed anything like that when writing web pages with HTMX, html-form (my own), nor htmz-be (another one I wrote based off of htmz but the back end decided where the HTML will go, similar to data-star and nomini). When I write code from the back end and target the front end I can use middleware to common updates. Here's the most complex app I've made w", "context": "", "use_case": "DOM diffing", "switched_from": "", "story": "Please just try HTMX"}]}], "caveats": [{"label": "", "summary": "", "quotes": [{"id": 785182176, "item_id": 49073886, "url": "https://news.ycombinator.com/item?id=49073886", "by": "rubyfruit", "date": "2026-07-27", "stance": "warn", "quote": "Don't like that you need a 3rd party library for something so basic", "excerpt": "1) Don't like that you need a 3rd party library for something so basic 2) It looks like they have the same problem anyway: https://github.com/patrick-steele-idem/morphdom/issues/261 This issue is reporting the same kind of thing - text selection is lost on re-render", "context": "", "use_case": "DOM morphing for htmx", "switched_from": "", "story": "Removing React.js from the codebase and adapting Htmx for UI interactivity"}]}], "who": [], "tags": [], "use_cases": ["dom diffing", "dom updates", "dom morphing for htmx", "dom morphing for ajax"], "compared": [{"slug": "htmx", "name": "htmx", "co": 4, "switched_from": 0, "switched_to": 0}, {"slug": "datastar", "name": "Datastar", "co": 2, "switched_from": 0, "switched_to": 0}], "makers": [], "threads": [{"url": "https://news.ycombinator.com/item?id=46312973", "title": "Please just try HTMX", "mentions": 3}, {"url": "https://news.ycombinator.com/item?id=49067301", "title": "Removing React.js from the codebase and adapting Htmx for UI interactivity", "mentions": 2}, {"url": "https://news.ycombinator.com/item?id=47285876", "title": "Show HN: \u00b5JS, a 5KB alternative to Htmx and Turbo with zero dependencies", "mentions": 2}, {"url": "https://news.ycombinator.com/item?id=49950554", "title": "Why don't more developers \u201cuse the platform\u201d?", "mentions": 1}, {"url": "https://news.ycombinator.com/item?id=48912175", "title": "How I use HTMX with Go", "mentions": 1}], "sentiment_by_month": {"2025-11": {}, "2025-12": {"recommend": 1}, "2026-01": {}, "2026-02": {}, "2026-03": {"recommend": 1, "neutral": 1}, "2026-04": {}, "2026-05": {}, "2026-06": {}, "2026-07": {"neutral": 1, "recommend": 1, "warn": 1}, "2026-08": {}, "2026-09": {}, "2026-10": {"neutral": 1}}, "quotes": [{"id": 799259792, "item_id": 49953737, "url": "https://news.ycombinator.com/item?id=49953737", "by": "hnedeotes", "date": "2026-10-04", "stance": "neutral", "quote": "morphdom replaces the dom nodes of a dialog because it will just make it disappear", "excerpt": "Yeah, the dialog thing is extremely annoying... I use them, and I always have to have a work-around for when morphdom replaces the dom nodes of a dialog because it will just make it disappear ... `non-programmatic-open=true` would solve it - yes, it can have edge cases but then it's a matter of me programming correctly, instead of programming work-arounds every time I need it.", "context": "", "use_case": "DOM updates", "switched_from": "", "story": "Why don't more developers \u201cuse the platform\u201d?"}, {"id": 785182176, "item_id": 49073886, "url": "https://news.ycombinator.com/item?id=49073886", "by": "rubyfruit", "date": "2026-07-27", "stance": "warn", "quote": "Don't like that you need a 3rd party library for something so basic", "excerpt": "1) Don't like that you need a 3rd party library for something so basic 2) It looks like they have the same problem anyway: https://github.com/patrick-steele-idem/morphdom/issues/261 This issue is reporting the same kind of thing - text selection is lost on re-render", "context": "", "use_case": "DOM morphing for htmx", "switched_from": "", "story": "Removing React.js from the codebase and adapting Htmx for UI interactivity"}, {"id": 785168417, "item_id": 49073026, "url": "https://news.ycombinator.com/item?id=49073026", "by": "christophilus", "date": "2026-07-27", "stance": "recommend", "quote": "DOM morphing seems like it\u2019s probably a good solution to this", "excerpt": "I haven\u2019t used it with htmx, but DOM morphing seems like it\u2019s probably a good solution to this. https://v1.htmx.org/extensions/morphdom-swap/", "context": "", "use_case": "", "switched_from": "", "story": "Removing React.js from the codebase and adapting Htmx for UI interactivity"}, {"id": 783374115, "item_id": 48960882, "url": "https://news.ycombinator.com/item?id=48960882", "by": "nymanjon", "date": "2026-07-18", "stance": "neutral", "quote": "have morphdom (HTMX uses idiomorph, I believe) which will do a comparison of the DOM", "excerpt": "With HTMX 4.0 it might be a bit nicer. I use my own home-grown HTMZ-BE lib/snippet that has the back end decide where to place the elements. Deciding from the back end makes it so you go from a lot of eventing on the front end to middleware on the back end, which significantly reduces the complexity of the application. And then when you do have a lot of interactivity you just send down the whole interactive area and ", "context": "", "use_case": "DOM diffing", "switched_from": "", "story": "How I use HTMX with Go"}, {"id": 756651424, "item_id": 47290714, "url": "https://news.ycombinator.com/item?id=47290714", "by": "0x20cowboy", "date": "2026-03-07", "stance": "neutral", "quote": "", "excerpt": "Not exactly what you\u2019re saying, but a bit closer. With this library you set what css classes on the page are \u201chot\u201d, it fetches the next page state and replaces that part of the page with the new state: https://github.com/robrohan/diffy", "context": "", "use_case": "", "switched_from": "", "story": "Show HN: \u00b5JS, a 5KB alternative to Htmx and Turbo with zero dependencies"}, {"id": 756631328, "item_id": 47289458, "url": "https://news.ycombinator.com/item?id=47289458", "by": "gaigalas", "date": "2026-03-07", "stance": "recommend", "quote": "I've done this previously with morphdom to AJAXify a purely server-driven backoffice system in a company.", "excerpt": "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 Overa", "context": "", "use_case": "DOM morphing for AJAX", "switched_from": "", "story": "Show HN: \u00b5JS, a 5KB alternative to Htmx and Turbo with zero dependencies"}, {"id": 742049185, "item_id": 46378074, "url": "https://news.ycombinator.com/item?id=46378074", "by": "nymanjon", "date": "2025-12-24", "stance": "recommend", "quote": "morphdom/idiomorph get you a long way", "excerpt": "HTMX and related libs work just fine as offline apps. I've been doing it with my personal apps I make for myself for a long time. Also, morphdom/idiomorph get you a long way even when you have highly interactive pages, especially if you have to hit the back end anyways. If you don't need to hit the back end then a front end lib is fine. But even then, the simpler pattern of hypermedia-driven applications can be bette", "context": "", "use_case": "", "switched_from": "", "story": "Please just try HTMX"}, {"id": 741483360, "item_id": 46342710, "url": "https://news.ycombinator.com/item?id=46342710", "by": "nymanjon", "date": "2025-12-20", "stance": "recommend", "quote": "I use Morphdom to just do a diff on the main section of the page.", "excerpt": "Here's an example offline-first hypermedia-driven soccer application. The match page is the most complex part of the application and I use Morphdom to just do a diff on the main section of the page. I find hypermedia-driven development to be super simple. I find React to be really complex. What normally takes me just some HTML rendered from the back end and some interactivity on the front end can be done in just a fe", "context": "", "use_case": "DOM diffing", "switched_from": "", "story": "Please just try HTMX"}, {"id": 741483105, "item_id": 46342694, "url": "https://news.ycombinator.com/item?id=46342694", "by": "nymanjon", "date": "2025-12-20", "stance": "recommend", "quote": "I just use morphdom for that part of the app and it makes it super easy", "excerpt": "Interesting read. I haven't quite finished it all. I haven't ever needed anything like that when writing web pages with HTMX, html-form (my own), nor htmz-be (another one I wrote based off of htmz but the back end decided where the HTML will go, similar to data-star and nomini). When I write code from the back end and target the front end I can use middleware to common updates. Here's the most complex app I've made w", "context": "", "use_case": "DOM diffing", "switched_from": "", "story": "Please just try HTMX"}]}