Datastar: Web Framework for the Future?

If you want a solid demo of what you can do with datastar. You can checkout this naive multiplayer game of life I wrote earlier in the week. Sends down 2500 divs every 200ms to all connected cliends via compressed SSE.<p><a href="https:&#x2F;&#x2F;example.andersmurphy.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;example.andersmurphy.com&#x2F;</a>

Reading tfa I kept wondering &quot;is this yet another framework where every click is a server round trip?&quot; Judging by the demos¹, the answer is yes?<p>If this is &quot;the Future&quot;, I&#x27;m branching off to the timeline where local-first wins.<p>¹. <a href="https:&#x2F;&#x2F;data-star.dev&#x2F;examples&#x2F;click_to_edit" rel="nofollow">https:&#x2F;&#x2F;data-star.dev&#x2F;examples&#x2F;click_to_edit</a>

Datastar author here... AMA, but know that Datastar is pure yak shaving for me to do real work stuff so I have no golden calves, just approaches I&#x27;ve seen work at scale.

The TODOS mini application at data-star.dev is slow and doesn&#x27;t work correctly for me (checking&#x2F;unchecking items isn&#x27;t reliable). To me, this highlights one common problem I&#x27;ve seen with frameworks that insist on doing everything on the server.

I&#x27;ve been working with datastar for a bit now and have really been enjoying it. If you are looking to try it out, I created a boilerplate template that distills some of the examples from the datastar site to get up and running with:<p><a href="https:&#x2F;&#x2F;github.com&#x2F;zangster300&#x2F;northstar&#x2F;tree&#x2F;main">https:&#x2F;&#x2F;github.com&#x2F;zangster300&#x2F;northstar&#x2F;tree&#x2F;main</a>

This matches 100% my experience and thoughts.<p>I really enjoy HTMX and it&#x27;s a blessing for my small-scale reactivity web interfaces, but I can immediately tell: &quot;Well, this is hard to organize in a way that will scale with complexity well. It works great now, but I can tell where are the limits&quot;. And when I had to add alpine.js to do client-side reactivity, it immediately was obvious that I&#x27;d love to have both sides (backend and frontent) unified.<p>Still need more time opportunities to roll some stuff with datastar in it, but ATM I&#x27;m convinced datastar is the way to go.<p>For reference, my typical &quot;web tech stack&quot;: Rust, axum, maud, datastar, redb.

Nitpicking but<p>&gt; SSE enables microsecond updates, challenging the limitations of polling in HTMX.<p>How is this true? SSE is just the server sending a message to the client. If server and client are in opposite sides of the world, it will not be a matter of microseconds...

<a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=0K71AyAF6E4" rel="nofollow">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=0K71AyAF6E4</a><p>I found this talk really interesting. It&#x27;s a cool framework for very interactive applications.

Really well-written and well-structured post! I&#x27;ll seriously evaluate Datastar in my next toy project because of the author&#x27;s praises!<p>For people who are looking for HTMX alternatives, I think Alpine AJAX is another choice if you are already using AlpineJS

The section on the author&#x27;s background could have almost been written by me. I&#x27;m also a PeopleSoft developer, and the ability to build fully-functional CRUD apps without needing to know about HTML, JavaScript, Browsers, etc, is severely underappreciated. For very simple CRUD pages, no code is required. For developing line-of-business apps it&#x27;s actually an incredible toolset.

I just wanted to say I love this entire &quot;ecosystem&quot;, if I may call it. Hypermedia is cool. HTMX looks like the natural evolution of HTML we all were expecting from the 90s. The simplicity of hx tags and the fact they get the work done is really refreshing. Datastar looks promising as well. It is already on my radar for a hobby project. Kudos to the dev team!

This is the second post I’ve seen praising Datastar in the last 24 hours, and once again no mention of the requirement to punch a gaping hole in one’s Content-Security-Policy.<p>If this is the framework of the future, cyber criminals are going to have a bright future!

&gt; Did I mention I hate javascript ... Avoid Javascript ... Javascript makes me queezy ... I broke out in hives because I hate JavaScript<p>Web development may not be your thing.

Correct me if I&#x27;m wrong, but isn&#x27;t half the point of htmx to allow for adaptive web design (ie, if js fails to load or is disabled it can still function via the form submission)?<p>It seems like Datastar is doing away with that entirely and binding the UI more tightly to JavaScript to function correctly.

On thing about datastar vs htmx: Datastar embraces htmx&#x27;s OOB swap and makes it a first class concept.<p>HTMX&#x27;s OOB swap appears to be an after thought.

&gt; fresh perspective, embracing server-driven architecture<p>This is not fresh perspective. I used to be on &quot;team everything on server&quot; but it&#x27;s a mistake on insist on that today.

This looks really good. Kudos to the authors!<p>It&#x27;s great seeing a rise of web stacks that embrace small libraries and native web technologies, and reject mega monolithic frameworks. It&#x27;s about time the industry moved away from the React&#x2F;Vue&#x2F;npm insanity.<p>I&#x27;m also intrigued by Nue, but Datastar fits nicely in a full stack solution. The choice of SSE is brilliant. It&#x27;s great tech that&#x27;s generally underutilized.

The other day I bumped again into Markus Lanthaler&#x27;s hypermedia adventures with Hydra [0] &quot;Hypermedia driven web API&#x27;s&quot; dating back from Semantic Web days, and later revived and stalled again as the W3C Hydra Community Group [1]. Though very different it hinted at the great power of hypermedia at the time. And I am very happy to see things getting explored again, in this different and refreshing approach. Greatly enjoyed watching the interview [2] of Delaney Gillilan on the hypermedia-tv Youtube channel.<p>[0] <a href="https:&#x2F;&#x2F;www.markus-lanthaler.com&#x2F;hydra&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.markus-lanthaler.com&#x2F;hydra&#x2F;</a><p>[1] <a href="https:&#x2F;&#x2F;www.w3.org&#x2F;community&#x2F;hydra&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.w3.org&#x2F;community&#x2F;hydra&#x2F;</a><p>[2] <a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=HbTFlUqELVc" rel="nofollow">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=HbTFlUqELVc</a>

One idea i found interesting on top: why not use a service-worker to mock the backend completely (<a href="https:&#x2F;&#x2F;mswjs.io&#x2F;" rel="nofollow">https:&#x2F;&#x2F;mswjs.io&#x2F;</a>) and mock the server answers with the service-worker. Then you still have a local-only PWA-style frontend and can choose yourself, how to sync it back to a server if you really like or need to.<p>What datastar is great for is: throw all that overcomplicated frontend-junk away and concentrate on the real innovation or simply get things done. Not to forget: ignore the dependecy-hell of every nodejs-based project you can encounter. After the lowcode-initiative, now it&#x27;s time for the &quot;nodeps&quot;-initiative. Deprecate npmjs.com.

first, great well structured and accessible post.<p>convinced me to maybe try datastar out next prototype where its applicable. reminds me of htmx with hyperscript if hyperscript wasnt kind of a joke. to clarify, the author of hyperscript calls it a sort-of joke and im not trying to slam it.<p>ive used htmx and hyperscript for prototyping because its entertaining and the novelty is motivating. i found similar issues as the author of this post where i talk myself out of using htmx for the product by the end of prototyping.<p>all that said we&#x27;ve been evaluating a react sdk provided by ESRI (experience builder) and diving into that makes me stare longingly at datastar where it seems like i could use signals to update client-side data from 3rd party apis

Future? Looking at some of the examples, this seems a lot like the same old web server frameworks we had like 15 years ago, maybe more. Granted they didn’t have SSE but regardless the DX was pretty bad. I don’t see a compelling reason to go back.

Also worth checking out is the recent release of RedwoodSDK: <a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=43657215">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=43657215</a>

From datastar&#x27;s docs:<p><i>&gt; Backend Setup</i><p><i>&gt; Data star uses Server-Sent Events (SSE) to stream zero or more events from the web server to the browser. There’s no special backend plumbing required to use SSE, just some syntax. Fortunately, SSE is straightforward and provides us with some advantages.</i><p>As a django developer, this is very far from true. With htmx i get almost no backend changes (mainly in template code), where datastar would require me to rewrite it and may not be possible to implement at all.

I love the idea of datastar, but wonder how does one test it without using e2e testing? Also, I think it would be amazing and so much simpler if instead of using SSE, it just included all the events in a response. Maybe with SSE as an option for those who need true server pushes? I feel like most apps don&#x27;t require server push, and instead just need a list of events&#x2F;things to update from an action.

The web framework of the future is for better or for worse what Vercel and YouTubers talk about.<p>Original thinking is sorely lacking in the majority of the web dev community.

Cool, it even has a ruby sdk, gotta check it out!

As you escape the React&#x2F;JSX intoxification, you can drop the XML syntax.<p>It took us a while back in the day after the XHTML arc, but for sure it&#x27;ll be ok.<p>I know this looser SGML universe might feel a little kooky, but trust me it wears baggy trousers, rocks gifs with a hard g and offers great &lt;hugs&gt;.<p><pre><code> &lt;thank&gt;&lt;you&gt; &lt;nothankyou&#x2F;&gt;</code></pre>

This is probably a silly question, but how do I use loops? For example, if my backend returns an array of TODO items, how can i iterate through that and display on the frontend?

I&#x27;ll just leave this here. At first you might be afraid, or petrified. But then you&#x27;ll realize how you cannot live without this by your side.<p><a href="https:&#x2F;&#x2F;gonads.net&#x2F;" rel="nofollow">https:&#x2F;&#x2F;gonads.net&#x2F;</a>

Betteridge&#x27;s law of headlines? ;)<p>[1] <a href="https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;Betteridge%27s_law_of_headlines" rel="nofollow">https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;Betteridge%27s_law_of_headline...</a>

... was kinda inevitable that HTMX was going to bring about a Cambrian explosion in frameworks like the one it was built to escape.

&gt; &quot;what is a signal?&quot;<p>it&#x27;s another word for event

Hypermedia. The what now?

Ah another framework, will wait until it becomes unavoidable.

The future is frameworkless.