alternatives

www/content/essays/_index.md

@@ -34,6 +34,7 @@ page_template = "essay.html"
 * [htmx sucks](@/essays/htmx-sucks.md)
 * [Why Gumroad Didn't Choose htmx](@/essays/why-gumroad-didnt-choose-htmx.md)
 * [A Modest Critique of htmx](https://chrisdone.com/posts/htmx-critique/) [[Response]](https://news.ycombinator.com/item?id=41782080)
+* [Alternatives](@/essays/alternatives.md)
 
 ### Building Hypermedia Applications
 * [Hypermedia-Driven Applications (HDAs)](@/essays/hypermedia-driven-applications.md)

www/content/essays/alternatives.md

@@ -0,0 +1,93 @@
++++
+title = "Alternatives to htmx"
+date = 2025-01-12
+updated = 2024-01-12
+[taxonomies]
+author = ["Carson Gross"]
+tag = ["posts"]
++++
+
+[htmx](/) is only one of many different libraries & frameworks that take the
+[hypermedia oriented](@/essays/hypermedia-driven-applications.md) approach to building web applications.  I have
+said before that I think the [ideas of htmx](/essays) / [hypermedia](https://hypermedia.systems) are more important than
+htmx as an implementation.
+
+Here are some of my favorite other takes on these ideas that I think are worth your consideration:
+
+## Unpoly
+
+[Unpoly](https://unpoly.com/) is a wonderful, mature front end framework that has been used heavily (especially in the
+ruby community) for over a decade now.  It offers best-in-class [progressive enhancement](https://developer.mozilla.org/en-US/docs/Glossary/Progressive_Enhancement)
+and has many useful concepts such as [layers](https://unpoly.com/up.layer) and sophisticated 
+[form validation](https://unpoly.com/validation).
+
+I interviewed the author, Henning Koch, [here](@/essays/interviews/henning_koch.md)
+
+You can see a demo application using Unpoly [here](https://demo.unpoly.com/).
+
+## Datastar
+
+[Datastar](https://data-star.dev/) started life as a proposed rewrite of htmx in typescript and with modern
+tooling.  It eventually became its own project and takes an [SSE-oriented](https://data-star.dev/guide/getting_started#backend-setup)
+approach to hypermedia.  
+
+Datastar combines functionality found in both htmx and [Alpine.js](https://alpinejs.dev/) into 
+a single, tidy package.  
+
+You can see many examples of Datastar in action [here](https://data-star.dev/examples).
+
+## Alpine-ajax
+
+Speaking of Alpine (which is a common library to use in conjunction with htmx) you should look at 
+[Alpine AJAX](https://alpine-ajax.js.org/), an Alpine plugin which integrates htmx-like concepts directly into Alpine.
+
+If you are already and Alpine enthusiast, Alpine AJAX allows you to stay in that world.
+
+You can see many examples of Alpine AJAX in action [here](https://alpine-ajax.js.org/examples/).
+
+## Hotwire Turbo
+
+[Turbo](https://turbo.hotwired.dev/) is a component of the [Hotwire](https://hotwired.dev/) set of web development
+technologies by [37Signals](https://37signals.com/), of [Ruby on Rails](https://rubyonrails.org/) fame.  It is a polished
+front end framework that is used heavily in the rails community, but can be used with other backend technologies as well.
+
+Some people who have had a bad experience with htmx [have enjoyed turbo](https://news.ycombinator.com/item?id=42615663).
+
+## htmz
+
+[htmz](https://leanrada.com/htmz/) is a brilliant, tiny library that takes advantage of the fact that anchors and forms
+already have a [`target`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target) attribute that can target 
+an `iframe`.
+
+This, in combination with the `location hash`, is used to allow [generalized transclusion](https://dl.acm.org/doi/fullHtml/10.1145/3648188.3675127#sec-7).
+
+This is the *entire* source of the library (I'm not joking):
+
+```html
+  <iframe hidden name=htmz onload="setTimeout(()=>document.querySelector(contentWindow.location.hash||null)?.replaceWith(...contentDocument.body.childNodes))"></iframe>
+```
+
+Amazing!
+
+## jQuery
+
+Finally, good ol' [jQuery](https://jquery.com/) has the the [`load()`](https://api.jquery.com/load/#load-url-data-complete)
+function that will load a given url into an element.  This method was part of the inspiration for 
+[intercooler.js](https://intercoolerjs.org), the precursor to htmx.
+
+It is very simple to use:
+
+```javascript
+  $( "#result" ).load( "ajax/test.html" );
+```
+and might be enough for your needs if you are already using jQuery.
+
+## Conclusion
+
+I hope that if htmx isn't right for your application, one of these other libraries might be useful in allowing you to
+utilize the hypermedia model.  There is a lot of exciting stuff happening in the hypermedia world right now, and these
+libraries each contribute to that.
+
+Finally, if you have a moment, please give them (especially the newer ones) a star on Github: as an open source 
+developer I know that Github stars are one of the best psychological boosts that help keep me going.
+