I have lots of notes of varying types and formats. Org-mode files are all pretty standard, but there's like 3 different Markdowns and an untold number of randomly-formatted .TXT files. I want to generate their webpages on-the-fly and not have to worry about exporting it.
One of the "crap mixed in" things I want is to integrate parts of a gitweb-like interface into the notes. I reference repos and commits regularly in my notes. Would be neat to mouse-over them and get a little popup with basic info about it.
I also like that the author refers to themselves as a Technomancer. Personally I'm an metamagical artificer. I love meeting fellow adventurers.
If you combine e.g. hx-post with hx-target, then it will put the text from the response into the target selector... but there is no "hx-source" to select what part of the response to use.
I'd really love to be able to set e.g. hx-source="somejsonfield" instead of having to manually handle the response with a custom function that parses/error checks the json and then sets the selector's text to the value of a json key. It could really save a lot of boilerplate code IMO.
Obviously you _could_, and it might even work well, but I think that's using the tool against its grain.
If you're calling APIs that you have no control over, you do so on your server.
That's the entire point of HTMX: the minimal necessary addition to browsers/HTML to allow HTML REST APIs to update pages without full page loads.
Htmx is "bring your own backend", but you do have to have a backend, be it Haskell or Zig or Gleam, that talks to your API, and renders HTML.
If you're not sending just exactly the necessary HTML to replace the target's HTML; if you need to parse JSON, then even jQuery would be better suited.
The whole idea of HTMX is to get rid of the extra steps.
And since htmx also has template plugins, being able to feed JSON values into it makes sense to me... a similar project, EHTML has this feature.
we do have a json extension for handling JSON responses, but it's a step away from the hypermedia architecture:
One way would be to go with React, Nest.js, setting up SSR and hydration of just the right fragments, etc. Another would be to take your existing static HTML page, and add very few bits in a specific place.
An easy example: a "like" button + counter of "likes" under a blog post.
If you need a complex SPA UI, you need a different tool.
The framework landscape has remained relatively entrenched in React since 2016. Sure theres a few new ones time to time but nothings ever come close to unseating it in the same way it took over from Angular.
(Yes you could argue Nextjs but thats just react with a backend bolted to it)
It's by the Flutter team lead talking about how with WASM we can redo the web stack by eschewing HTML, CSS, and JS entirely.
name one thing using "flutter web".
Flutter is just the thing startups use until they can hire a dedicated IOS person and fork the "app" codebase.
The WASM approach holds promise too and is interesting to me for opening up support for non-JS languages, but a built in UI toolkit would bring the advantage of not needing a compiler or toolchain (just like the traditional web) which can be advantageous and lowers the bar for entry.
But then microsoft took everything and ran with it. And now people believe typescript is good because their text editor lies to them.
Be it React or Svelte or whatever. With serverless backend if you want to keep costs down. Although a server from Hetzner isn't that expensive and you can host multiple APIs there.
That's the whole point of HTMX: Going back to what works: trusty old HTML attributes, but giving them intuitive interactions.
Instead of learning the microframework du jour, you just add some attributes into your HTML templates, and get your desired result.
1. The user interacts with the page.
2. The page sends a request to the server.
3. The server returns one response to the client, containing HTML, which the client inserts into the page.
4. (Optional) If the response includes references to other resources, like images or fonts, the client makes more requests for these.
The consequence of the 'one request, one response' thing is that the whole thing is fast. All the HTML arrives in one go. None of this request-one-thing-then-run-some-JS-on-the-client-to-decide-whether-to-request-another-thing nonsense that you can watch happening in real time that happens in an alleged productivity tool I have to use at my day job.
It is the age old problem between better tech or better pay? What is even worse younger dev come in wanting to learn React cause it is the one that most job post is looking for. We end up negative economic to tech quality.
class Counter does Component {
has Int $.count = 0;
method increment is controller {
$!count++;
self
}
method HTML {
input :id("counter-$.id"),
:name("counter"), :value($!count)
}
}Which is so much worse than the current paradigm where we have a client side SPA deciding to do all sorts of state syncing and react hooks and tracking pixels and auto pop ups all doing their own thing all over the place!
/end sarcasm/
I think for a side project, not immediately expecting your front end's first version to not horizontally scale to the moon is ok.
Where HTMX would run into trouble is complicated frontend logic, where updates of one area may trigger changes in another, etc.
HTMX is basically a framework for AJAX that lets you more quickly set up interactions in the markup instead of having to write scripts to manipulate the DOM yourself. It also tells on sending HTML fragments over the asynchronous request instead of JSON that has to be "rendered."
I've seen a few of HTMX projects attempted in production, at my previous employer. Decently sized, moderately complex web products for serious commercial purposes
I will say though, all three were complete disasters.
https://htmx.org/essays/when-to-use-hypermedia/
However, in many case, it can be much simpler architecture than alternative approaches:
It is truly refreshing to see how simple web development can be when using htmx instead of a full spa framework.
I do full stack (angular, aspnet core, mssql) development in my daytime job. It can be... tiresome. Past couple of years i've built a soundcloud-like app using htmx, nodejs, express, mysql. Loved every minute.
Thank you for all your effort on htmx.
Edit: spelling.
It was a kiosk app running on mobile tablets. It could have been a small native app, but the team, who were all pure Pythonists, tried that and decided it was too hard. So someone said React would be easy; after all it's just gluing together components, right?
The React app was built in ~3 months but the deadlines had created technical debt. When the team had problems modelling all the state, and the Redux store became an incomprehensible mess, someone said, "The problem is React. HTMX will finally make things simple".
They spent ~9 months on their HTMX rewrite and got even less far than the React version. It had numerous bugs; the UX had various regressions; it couldn't properly interact with some custom hardware; the state was now in the DB and apparently was not looking much nicer than it was in Redux, and eventually management pulled the plug.
I didn't work on it directly so I don't know how much HTMX itself stymied the project. From my interactions with the team, I think the real problem was the attitude of the developers. They decided they "hated React" when in truth they were bad at thinking about UI, particularly UI state, and unwilling to learn.
And HTMX gave succour to the fantasy they could continue not to. In fact that's how the initiative was sold to management, a way to turn non-UI devs into UI programmers.
I am guessing there is a whole generation of developers growing up where front end equals React and HTMX / HTML / CSS is somewhat of an alien. Compared to some of us growing up with HTML, DHTML and Ajax.
If I now look at how I use htmx in go, I need something like templ to develop reusable components that I can test independently. To be able to work independently, it would make sense to mock the properties of the components. So I could build a design system or component library with go and htmx that I can test before I use it in the "real" application. That's how I know it from the Ajax era, when SpringBoot was used, for example. You copied the html of the frontend component and "translate" it into Spring. When I remember that time, I praise today, when it is enough to have an openapi spec with which you can make agreements.
On the other hand, I clearly see the advantage of htmx if the project has one or two developers and you use an already finished design system or component library.
No, not like Gmail. Orders of magnitude less complex than that.
No, being JS/React "native" wasn't the problem there. Actually the opposite. The developers were not willing to think about an application with state, and when they found modelling this hard (with Redux), they decided that React (a different technology) was the problem.
In the end what you get out of your React code after your build process is vanilla HTML, CSS and JS. While you might be able to abstract some of those things away using libraries, all you‘re doing in your React code is building and manipulating HTML DOM trees within your React code and styling them using CSS (or using some abstraction like CSS-in-JS, CSS modules, etc.). To do so efficiently, you not only require knowledge of how exactly HTML and CSS work but also what React tends to do under the hood to render out your application. Even more so when things like a11y are required. A good dev also knows when to use JS to reimplement certain interactions (hover states, form submits, etc.) and when to use the native functionality instead (for example CSS pseudo selectors or HTML form elements).
All this is to say that I disagree with the notion that React devs don’t know or understand the underlying technologies. It might be different and more abstracted, but it’s still the same technologies that require the same or more understanding to be used efficiently.
You need to be catastrophically bad to mess something like htmx.
If you are doing things like eCommerce, form heavy, read heavy, websites (the majority) instead of full apps like a paint/game/code editor (that I say should start with htmx and small components with whatever), htmx IS so simple.
What kind of messy backend this projects have that failed it? Because this is the point: htmx is just html with a bit of more interactivity.
To fail with htmx then you MUST has failed to render html well, and if that is the case, with react will be even worst.
An outcome like this suggest that if the project were made in react or similar it will have failed even harder
Datastar considers its library v1.0 release [1] to be complete, offering a core hypermedia API, while all else consists of optional plugins. The devs have a hot take wrt htmx in their release announcement:
> While it’s going to be a very hot take, I think there is zero reason to use htmx going forward. We are smaller, faster and more future proof. In my opinion htmx is now a deprecated approach but Datastar would not exist but for the work of Carson and the surrounding team.
When you think of adopting htmx, it may be worth making a comparison to Datastar as well.
Anyone have any examples that are noteworthy?
so far I got HARM (Rust), HARC (Raku) and now HAM (F#) along with Fast HTML / htpy (Python) and GOTHH (Go)
seriously, it is very good news that HTMX has uncoupled web development from the server side language choice
now there is a blossoming of many server side stacks to fill this new opportunity
I wrote https://harcstack.org because Raku is the natural successor to perl and PHP for web development due to its facility with text processing and multi-paradigm chops
Maybe it could be useful alongside HTMX even: client-side HTML manipulation for simple things and server-side HTML hydration and rendering for complex things.
Finnucane•1d ago
This is debatable. Plenty of js heavy websites feel slow and clunky.
flemhans•1d ago