top | item 35534520

(no title)

Dauros | 2 years ago

Because they are actually two distinct views: one is a details view, the other one is a form view. HTMX loads the form view and replaces the respective part of the page. But it needs to contact the backend for the form, you don't have the data model on the client like with an SPA framework, so you cannot generate the form.

discuss

order

schemescape|2 years ago

Is this actually a reasonable scenario for using HTMX? Is JavaScript even required?

Dauros|2 years ago

HTMX is basically a JavaScript framework that makes the traditional request-response approach feels like an SPA via replacing only part(s) of the current page with the response. In this case: it loads a small form, submits it to the backend, then replaces the respective part of the page with the updated markup. The state is kept only at the backend.

With some constraints you can create a page that works with or without JS. The same endpoint can be used for serving HTML fragments for HTMX and full page for JS-disabled clients since the HTMX request can be detected by the HX-Request header.

robertoandred|2 years ago

So any UI change requires a network round trip?

neurostimulant|2 years ago

You're probably comparing htmx with client-side framework like React. Unlike those client-side ui framework, htmx is used to enhance standard html pages, such as those outputted by server-side web framework. Those frameworks typically renders detail and form page separately, and htmx can combine them into a single interactive page. For example, when you reply a comment in HN, it'll open the form as a new page, and when you submit the comment, it open another page. htmx can combine all of those pages into a single interactive page.

john2x|2 years ago

I'm hoping a future version will allow using hidden markup that's already in the DOM rather than fetching from the server.

Dauros|2 years ago

Not at all, you can preload as many data as you wish and use vanilla or a companion JS framework like Alpine.js or HyperScript or any web-component to make the current page interactive without fetching the backend. It's a trade-off between the initial page size vs. additional network delay.