PostHole
Compose
Login
SE Radio 671: Carson Gross on HTMX
In this episode, SE Radio host Sriram Panyam explores HTMX with its creator, Carson Gross, who is also creator of Hyperscript, the mind behind the Grug Brained Developer, a professor of software engineering at Montana State University, and co-author of Hypermedia Systems.
HTMX is a modern JavaScript library that allows developers to access AJAX, WebSockets, CSS Transitions, and Server-Sent Events directly in HTML using attributes. It represents a return to hypermedia-driven application architecture while supporting modern user experiences. The episode starts with a look at the current complexity in web development and how HTMX offers an alternative approach. Carson explains the core philosophy of "HTML as the interface" and how hypermedia principles influenced HTMX's design. From there, they dive into HTMX's technical concepts, including its attribute system, server-side integration, event handling, and state management approach.
Carson shares some real-world implementation strategies, including migration paths from JavaScript frameworks, architectural patterns, and performance considerations -- as well as a few scenarios in which HTMX might not be the best fit. Finally, they look at the growing HTMX ecosystem, community contributions, and future development roadmap. Throughout the episode, Carson provides concrete examples and case studies of HTMX in production environments.
Brought to you by IEEE Computer Society and IEEE Software magazine.
In this episode, SE Radio host Sriram Panyam explores HTMX with its creator, Carson Gross, who is also creator of Hyperscript, the mind behind the Grug Brained Developer, a professor of software engineering at Montana State University, and co-author of Hypermedia Systems. HTMX is a modern JavaScript library that allows developers to access AJAX, WebSockets, CSS Transitions, and Server-Sent Events directly in HTML using attributes. It represents a return to hypermedia-driven application architecture while supporting modern user experiences.
The episode starts with a look at the current complexity in web development and how HTMX offers an alternative approach. Carson explains the core philosophy of “HTML as the interface” and how hypermedia principles influenced HTMX’s design. From there, they dive into HTMX’s technical concepts, including its attribute system, server-side integration, event handling, and state management approach. Carson shares some real-world implementation strategies, including migration paths from JavaScript frameworks, architectural patterns, and performance considerations — as well as a few scenarios in which HTMX might not be the best fit. Finally, they look at the growing HTMX ecosystem, community contributions, and future development roadmap. Throughout the episode, Carson provides concrete examples and case studies of HTMX in production environments.
Brought to you by IEEE Computer Society and IEEE Software magazine.
Show Notes
Transcript
Transcript brought to you by IEEE Software magazine.
This transcript was automatically generated. To suggest improvements in the text, please contact [email protected] and include the episode number and URL.
Sri Panyam 00:00:18 Hello, this is Sri Panyam for Software Engineering Radio. Today I have with me Carson Gross, the creator of HTMX, a library that’s challenging how we are thinking about modern web development by returning to the hypermedia-driven principles of the early web and all the while liking modern user experiences. Welcome to the show, Carson.
Carson Gross 00:00:40 Thank you. Very excited to be here. It’s really nice to be able to talk on a show that’s a little bit more geared towards software engineering and sort of principles instead of just, here’s another, here’s how HTMX works. So I’m excited to talk about sort of the philosophy and software engineering around it.
Sri Panyam 00:00:57 Sounds great. Before we dive into the details of HTMX, I want to get your perspective on the current state of web development these days. Web development seems to involve a lot of complexity; complex tooling, complex frameworks. Could you share your perspective on where we’re at?
Carson Gross 00:01:14 Yeah. I agree with that. I think obviously I wouldn’t have created HTMX, which we will get into the details of exactly how it works later, but it is a simpler way of creating at least a certain class or a certain percentage of web applications. And I think, as you point out, in the last say 10, 15 years, web development has gotten pretty complicated. Part of that was driven by needs. Obviously if you need a more sophisticated user interface, things get more complicated. But I think, part of it too is just driven by developers. We have a hard time saying no to things and the shiny new thing and being impressed by sophisticated approaches rather than maybe accepting a little bit less sizzle, but with a simpler approach. And so I think it’s been a mix of those things. I don’t think I’m alone in suggesting and modern web development, which is really, I think the main area, HTMX is interesting. It’s pretty complicated now. There are a lot of people that are very good at it and experts at it. So, and I don’t want to denigrate what they can do and what they can achieve with the tools they have. But at the same time, I do think there’s a large class of web applications in particular that could be simplified using some of these older ideas.
Sri Panyam 00:02:29 Nice. And in terms of these challenges, where and how does hypermedia driven approach come in? I mean, first of all, what is it?
Carson Gross 00:02:37 Yeah, let’s talk about what the hypermedia approach is. So HTMX is what I call a hypermedia driven library. And what that means is that it uses the ideas of hypermedia, which are very old. I mean, the term was coined back in the 1960s and obviously the web was invented in the 1990s. So you’re talking about some pretty old ideas at this point. But with HTMX, the idea is let’s take those ideas and sort of extend them. And really the big idea, I would say in hypermedia is this notion of what’s called a hypermedia control. What makes hypermedia interesting from a technical standpoint is that you mix control information and display information in a single document. And I don’t know if, Ted Nelson might not, wouldn’t probably talk about it in that way, but I’m taking my terminology from Roy Fielding’s dissertation.
Carson Gross 00:03:27 He had a famous dissertation about REST, was describing the web. And I’ve written a paper and a CM paper that you can read called Generalizing Hypermedia Controls that sort of riffs on this idea. But again, to get back to your original question, a hypermedia is a media, so some format that sort of display content weíre used to when we talk about media. But then it has these special things called hypermedia controls mixed in. And so the canonical hypermedia control is the anchor tag. And so you put an anchor tag in an HTML document and then someone clicks on it, and they go somewhere else. And that doesn’t seem much probably to you or me because we’re so used to the web, but from a historical perspective, what you’re doing is you’re putting control information in the document, you’re putting navigation in the document itself, and that’s really what makes it a hypermedia, something that’s beyond normal media.
Carson Gross 00:04:18 So when the term hypermedia was coined, Nelson was contrasting it with books and magazines and things this where he just kind of plotted through it directly. And I think the informal definition that he gave was basically any sort of media that needs to be consumed on a computer because computers allow you to have these interactive experiences. So again from my perspective as a computer scientist, I really focus in on this notion of hypermedia controls. We talked about links, the other major hypermedia control that’s available in HTML, which is a hypermedia format is our forms. And so if your listeners have ever created a form in HTML to submit a contact or something that or just filled out everyone has experience with a credit card form at this point and click submit and then you purchase something that’s different, that actually forms were added in HTML 2.0.
[...]