HTMX - A js library sort of like liveview

[derek-zhou]

@matthias_toepp

From what I understand, they are both promoted as covering most of the use cases.

Define “most of the use cases”. I don’t believe in panacea, but that’s just me.

Liveview is the most advanced solution for a stateful server patching a client. On the other hand, HTMX is not unique for stateless XHR into DOM; there are prior arts, other well established solutions, and hand rolled solutions. HTMX has a catchy name but not really advancing the state of art.

[sreyansjain]

Can you do a CRUD or business app with both - Yes you can.
Should you use live view for a static site - NO.
Can you use htmx for it - YES.

htmx is easy to pick up and you can get started in an afternoon.
Liveview has a higher learning curve than htmx. But once you learn it its more enjoyable.

Liveview is more declarative and htmx is more explicit.

[AstonJ]

There’s currently an AMA on devtalk with the author of Server-Driven Web Apps with htmx (you can win a copy via the AMA) and after reading its description…

htmx is a library that adds logic and server interaction to HTML; you get the effect of using a front-end SPA framework without writing front-end code. Use any server-side programming language and framework to build server applications with endpoints that simply return snippets of HTML. Dynamically update portions of the current web page from HTTP responses. Add interactivity with JavaScript and libraries such Alpine and _hyperscript. Make your apps more secure by escaping user-supplied content and specifying a Content Security Policy. Go beyond basic HTTP requests with WebSockets and server-sent events.

I was curious whether anyone has used it with Phoenix and whether there are any use cases for it alongside LiveView? (Like would you ever want to use both such as in different parts of an app?)

@garrison

The programming model is wildly different, and so are the use cases.

@garrison

The only other thing to note is that what LiveView does is really only possible on the BEAM, as it can actually handle that many stateful connections without catching fire. The HTMX approach on the other hand is something you can do on any stack (including Phoenix!). But again, they are completely different approaches that are not useful for solving the same problems.

What kind of apps/areas do you think each excel?

[thiagomajesk]

@AstonJ

I was curious whether anyone has used it with Phoenix and whether there are any use cases for it alongside LiveView? (Like would you ever want to use both such as in different parts of an app?)

I did a lot of Unpoly a couple of years ago, which is pretty similar to HTMX (a bit more abstract). I don’t see how useful it would be to mix the two honestly as both would be competing to control the DOM. What I like about HATEOAS or HTML over the wire is that it’s really explicit when things are initiated and how you return the state back to the client.

It’s a fine approach, but to me, the main issue with Unpoly/ HTMX is dealing with really complex state (the URL here being the main driver here), which is effortless with LiveView. There’s an argument to be made about explicitness though, but still.