3 ms·
> 1) you dont care about keeping UI state on the parts that are replaced (incl any stateful children of the UI element that happen to be there in your DOM struc
by jdiff 2y ago
> 1) you dont care about keeping UI state on the parts that are replaced (incl any stateful children of the UI element that happen to be there in your DOM structure), and 2) when you dont have to update the app in any other places when your state changes
Htmx does have tools for both of these cases. Out of the box, htmx throws out state, but there are plugins such as morphdom-swap for merging in the new DOM fragment into the old while keeping state. I have some client-only state that holds references to DOM elements in Javascript, and by default, yes, htmx breaks all those references as those elements no longer exist. Link in morphdom-swap, and my references live on across reloads, even across attribute and content changes.
And for #2, htmx also allows you to swap in elements that are not the target element, just by specifying that that's what you want.
IMO these are pretty basic tools of htmx. Like you said, without them about the most complex thing you can create is a to-do list, and sometimes not even that.
- swyx 2y ago> morphdom-swap this https://github.com/bigskysoftware/htmx-extensions/tree/main/src/morphdom-swap https://github.com/bigskysoftware/htmx-extensions/tree/main/... with 159 stars is a basic tool of htmx? is this the community consensus?
- jdiff 2y agoNo. Morph swaps[0] are the basic tool of htmx. Morphdom-swap is simply the one that works for my usecase. [0] https://htmx.org/docs/#morphing https://htmx.org/docs/#morphing
- jonathrg 2y agoParts of htmx were yoinked out of the core library into an extensions repo relatively recently, as part of htmx 2.0. That might explain the relatively lower number of stars. More important than github stars is that it is indeed part of the htmx project and is documented here https://htmx.org/extensions/ https://htmx.org/extensions/
- throwitaway1123 2y agoThe htmx author maintains his own swapping library which has more stars (although I wouldn't judge a project solely based on Github stars): https://github.com/bigskysoftware/idiomorph?tab=readme-ov-file#htmx https://github.com/bigskysoftware/idiomorph?tab=readme-ov-fi...
- nsonha 2y agoJust step back for a second and think about programming without modeling the states. Framework or not, no amount of hacking/tooling can help you with that.