Hacker News Reader

Hacker News

Comment by recursivedoubts | Hacker News Reader

Parent Full thread

recursivedoubts

all the demos use a mock ajax request library (sinon) so we don't have to run a server

i intentionally introduced an 200ms delay so that you can see things like request indicators:

https://github.com/bigskysoftware/htmx/blob/master/www/stati...

View on HN

Why would there need to be any sort of network request to show edit fields?

well, if you are using a hypermedia style application then you want to make a hypermedia exchange on an interaction to bring down the hypermedia representation for editing a particular resource

So any UI change requires a network round trip?

Yep and that’s ok in some cases.

Well, there are UI changes and then there are UI changes.

https://htmx.org/essays/hypermedia-friendly-scripting

In general, I'd recommend perusing the essays to get a flavor of the style of web application we are advocating for:

https://htmx.org/essays/

And, if you want more, taking a look at our book:

https://hypermedia.systems

Not required, you could still use js if you wanted.

Why don't you stop posting questions to this page and take the time to read the Htmx landing page? It answers all of your questions. https://htmx.org/

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.

So any UI change requires a network round trip?

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.

But it's still as slow as two separate pages?

Should be a bit faster because it only requests a piece of html fragment which then get swapped into the dom instead of reloading the whole page again.

there is a good talk on a real world react->htmx port here:

https://htmx.org/essays/a-real-world-react-to-htmx-port/

in which improved performance features as a big part of the realized benefit of the conversion

of course, not every application is going to be amenable to a hypermedia-style approach, so your mileage may vary:

https://htmx.org/essays/when-to-use-hypermedia

Slower than what? In my experience, simple page loads are usually blazingly fast assuming you're not on 2g or something.

It's heavy client-side frameworks that often feel slow.

You've never used backend frameworks like WordPress? They can be very slow.

Yes. That's why I specified "simple page loads". If your frameworkless website is slow then the fault doesn't lie with the nature of http or the intrinsic overhead of full page loads. You've got a shitty backend framework, database or network.

Are your (repeated) questions in good faith, or are you taking a swipe at the project?

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

It's already supported with the client-side-templates extension [1]. HTMX can fetch JSON from the backend then calls e.g. nunjucks.render() with the data.

[1]: https://htmx.org/extensions/client-side-templates/

On a sufficiently long timeline we'll see full SPA frameworks on top of htmx ;)

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.

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

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.

> ...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.

Didn't that used to be called AJAX or REST or something?

Yes! HTMX is a better API on top of a XMLHttpRequest for this approach. A hypothetical next iteration of the HTML standard could make most of HTMX unnecessary. Maybe one day.

Answering my own question, you can make an element appear using just CSS and a hash:

https://enmascript.com/articles/2019/09/26/toggle-content-on...

I don’t like messing with the URL to achieve this, so unless using the “details” element, maybe JavaScript is actually the best approach…

Because the data might have changed between displaying it and opening the edit form.

May be it's worth adding a note on these pages that you are simulating network by introducing delay.

Reply on news.ycombinator.com