by tomhallett on 3/4/2024, 2:27:24 PM
by tomhallett on 3/4/2024, 1:14:15 PM
My first reaction was “why do I need an htmx-like version written in alpine?” when I could just use htmx. BUT… if you assume that you will need something more low level to complement htmx (“htmx + alpine” OR “htmx + hyperscipt”) and if you decide hyperscript is not for you, then it does make sense to a stack where the higher level is built upon the lower level: alpine-ajax + alpine.
Looks very interesting!
Also loved the comparisons, especially with rails/turbo and the downsides of custom elements wrt tables.
by pietz on 3/4/2024, 6:35:03 PM
Wait a second, this makes way more sense than it should.
by wysewun on 3/8/2024, 4:59:20 PM
I’ll have to play around with this but glad to have another great library with this mindset.
I always am unsure of whether to go with unpoly, livewire and htmx lol. Maybe this will push towards htmx
by iainctduncan on 3/4/2024, 3:33:10 PM
All of these related projects remind of Dojo Didgets from the mid 2000s. Not that that's a bad thing, I found that tool kit very productive!
Anyone else remember Dojo fondly? Am I way off base here?
by shoqr on 3/4/2024, 6:53:57 PM
That looks interesting. It resembles Unpoly approach to me.
Quick question about redirect with `nofollow`. Does it do a full page reload or just refresh a page like Turbo (swaps body and merges head)?
by snthpy on 3/5/2024, 6:09:07 AM
Looks very cool!
I also love the 50s styling and theme. Awesome job!
by spiderfarmer on 3/4/2024, 9:22:55 AM
I use Livewire v3 (also fully Alpine based now) in my latest project and it has truly transformed my approach to web apps. It’s truly amazing.
by pietz on 3/4/2024, 7:12:34 PM
Can it do something similar to hx-trigger="load"?
by elspecal on 3/4/2024, 9:30:19 AM
looks sweet! wanna try out building something using HTMX. i'm curious about its limitations in terms of project size/complexity
by niutech on 3/5/2024, 4:18:13 AM
Nice! But how to deal with i18n?
by gardenhedge on 3/4/2024, 6:07:25 PM
No JSON needed? I like JSON
by alucab on 3/4/2024, 9:25:32 AM
It would be JQuery...
by auct on 3/4/2024, 2:12:40 PM
Try uajax on GitHub
A few features which look minor but the author got totally right, which IMHO would allow this solution to scale very well with more complex applications.
1) X-Alpine-Target
``` <form method="post" action="/comments" x-target="comments comments_count" ```
generates an ajax request with this header by default:
``` X-Alpine-Target: comments comments_count ```
This is very very cool! In most usecases, one the serverside I can return a full html document and alpine-ajax will only look for #comments and #comments_count in the response. BUT, if I want the serverside to be faster (ie: do less), then the client is able to tell the server which parts of the html it wants via the `X-Alpine-Target` header -- instead of the server having to know which parts need updating via the url alone. It's like graphql for the htmx/hotwire architecture.
2) `ajax:missing`. If the client expects dom ids to be in the response and they aren't there, you can create a sentry error to expose the broken "contract" between the initial page's request and the action's response.
3) x-merge="append"
In hotwire, the html markup is dumb and the turbo-stream response is smart (`turbo-stream action="append"`). But in alpine-ajax, the response is dumb and the html markup is smart (`x-merge="append">`). This difference is subtle, but it allows for the serverside responses (for actions) be more general purpose/discrete components, while the ux which might change from page-to-page or section-to-section is decoupled to that page's/section's container html.
4) x-sync
"Elements with the x-sync attribute are updated whenever the server sends a matching element, even if the element isn't targeted with x-target."
Wow - amazing developer ux for cross cutting concerns like notifications, flash messages, etc. So practical.
5) Creating demos with an alpine-ajax mock server.... wow, an out of the box way to make standalone component test pages.