14 ms·
I switched from Htmx to Datastar
- globalhsbc 1y ago[dead]
- sgt 1y agoDatastar is like Htmx done even better. I'm seriously keen on trying it out. It's not like Htmx is bad, I've built a couple of projects in it with great success, but they all required some JS glue logic (I ended up not liking AlpineJS for various reasons) to handle events. If Datastar can minimize that as well, even better!
- sudodevnull 1y agoRead the grugs around the fire essay on the datastar site
- mike_hearn 1y agoIronically given the topic is hypermedia, the article doesn't link to the Datastar website. Here it is: https://data-star.dev/ https://data-star.dev/
- marvel_boy 1y agoLink to datastar portal: https://data-star.dev/essays/why_another_framework https://data-star.dev/essays/why_another_framework
- thm 1y agoDatastar's "Build reactive web apps that stand the test of time" tagline invites some skepticism.
- Hnus 1y agoHTMX can do all of that via OOB updates no?
- yawaramin 1y agoYup, which is why I never understand why people keep making this criticism that could have been avoided by just reading the docs a little bit more or even asking on the htmx Discord.
- munchlax 1y agoYeah but then you don't get to write a cool blog post.
- hide_on_bush 1y agoyou miss the sse support (in htmx it's a plugin) and the reactivity part (like alpine).
- sudodevnull 1y agoif you think they work the same at all you haven't tried either
- TeddyDD 1y agoOOB is annoying in HTMX because you need to include hx-swap-oob attribute in every component you want to swap this way. In Datastar you just use id.
- sudodevnull 1y agoSure, go try doing it and see what happens. Make sure to handle every verb, automatically connect, expo backoff, etc!
- Hnus 1y agoI literally do that, it is not that hard. Getting locked into framework with weird licensing is probably harder engineering problem to solve.
- leojfc 1y agoThanks for writing this up — some great insights! The server deciding what to replace reminds me of some old (dangerous, I think) patterns like returning actual JS from the server which the client then executes. But it was a nice pattern to work with: for example if you made code changes you often got hot-reloading ‘for free’ because the client can just query the server again. And it was by definition infinitely flexible. I’d be interested to hear from anyone with experience of both Datastar and Hotwire. Hotwire always seemed very similar to HTMX to me, but on reflection it’s arguably closer to Datastar because the target is denoted by the server. I’ve only used Hotwire for anything significant, and I’m considering rewriting the messy React app I’ve inherited using one of these, so it’s always useful to hear from others about how things pan out working at scale.
- cassiogo 1y agoI like Hotwire but I admit its a bit confusing to get started with and the docs dont help. Form submits + redirects are a bit weird, you cant really make the server "break out" of a frame during a redirect if the form was submitted from inside a frame (there are workarounds, see https://github.com/hotwired/turbo/issues/257 https://github.com/hotwired/turbo/issues/257). Also, custom actions [https://turbo.hotwired.dev/handbook/streams#custom-actions https://turbo.hotwired.dev/handbook/streams#custom-actions] are super powerfull, we use it to emmit browser events, update dom classes and attributes and so on, just be careful not to overuse it.
- naasking 1y ago> The server deciding what to replace reminds me of some old (dangerous, I think) patterns like returning actual JS from the server which the client then executes. Basically every single web page on the modern web has the server returning JS that the client then executes. I think you should clarify what's dangerous about the specific pattern you're thinking of that isn't already intrinsic to the web as a whole.
- rubenvanwyk 1y agoI recently read this: https://drshapeless.com/blog/posts/htmx,-datastar,-greedy-developer.html https://drshapeless.com/blog/posts/htmx,-datastar,-greedy-de... Which states some of the basic (great) functionality of Datastar has been moved to the Datastar Pro product (?!). I’m eager to support an open source product financially and think the framework author is great, but the precedent this establishes isn’t great.
- grim_io 1y agoI find it much more interesting to read from people who do programming as a hobby. They focus on the practical solutions much more than on the typical bikeshedding.
- kreetx 1y ago"Bikeshedding" means debating over aspects that don't matter (much; i.e, color of the bike shed), the linked blog post isn't about asthetic changes.
- grim_io 1y agoNor was my intent to label any of the linked blogs as such. My intent was to say that hobbyists have a different, refreshing approach to programming and it's technologies that I appreciate.
- stevesimmons 1y agoSame for me... I had been tracking Datastar for months, waiting for the 1.0.0 release. But my enthusiasm for Datastar has now evaporated. I've been bitten by the open-source-but-not-really bait and switch too many times before.
- osigurdson 1y agoMaintainers need a way to maintain during the day - not just evenings and weekends. Otherwise it eventually dies.
- wheresmylogin 1y agoInteresting write-up. Thanks. I've written costumer-facing interfaces in HTMX and currently quite like it. One comment. HTMX supports out-of-bound replies which makes it possible to update multiple targets in one request. There's also ways for the server to redirect the target to something else. I use this a lot, as well as HTMX's support for SSE. I'd have to check what Datastar offers here, because SSE is one thing that makes dashboarding in HTMX a breeze.
- nabla9 1y agocreated: 18 minutes ago Maybe I'm cynical, but fresh new accounts praising stuff that has only the core open source, works as negative-ad.
- darrenf 1y agoIsn’t HTMX fully open source? The comment you’re replying to has no outright praise for Datastar.
- cenamus 1y agoMust be part of HTMX' highly paid marketing team ;)
- wheresmylogin 1y agoMore like unpaid fan account. Anyway since HTMX is open source and free, it's easy to validate.
- rpdillon 1y agoYou're accusing the poster of shilling. That's against site rules, but aside from that it makes no sense in this context -- the post talks about the advantages of HTMX versus Datastar.
- alex_suzuki 1y agofrom https://data-star.dev/ https://data-star.dev/: Simple. Fast. Light. No VCs. Coded by Hand You have my sword!
- highwaylights 1y agoBeing new to Datastar and having seen some of the hype recently, I'm really not sold on it. The patch statements on the server injecting HTML seems absolutely awful in terms of separation of concerns, and it would undoubtedly be an unwieldy nightmare on an application of any size when more HTML is being injected from the server.
- mdallastella 1y agoThis. I feel wrong having endpoints that produce bits of HTML.
- hshdhdhehd 1y agoYes. It is OK for simple form submits but going to get annoying for anything that feels like an app.
- e12e 1y agoThere's a reason xpath and xls look they way they do - they're powerful, but not very comfortable :/ Reimplantations tend to simply some bits, but end up amassing complexities in various corners...
- Izkata 1y ago"Bits of HTML" was for a long time so common and normal it has its own term: HTML fragments.
- sudodevnull 1y agoServers sending HTML to the browser? Scandalous!
- naasking 1y agoWhat has the world wide web come to?!
- dpc_01234 1y ago
- trumbitta2 1y agoI can't say I like the server returning portions of HTML that need to match the HTML in the client, but I can see myself trying it in a monorepo and using some templating lib on both sides. Let's say I'm intrigued and on the fence.
- nasretdinov 1y agoI guess one thing that might be potentially problematic is that if you update the server while someone has the page still open you need to match their original templates version and not the new (potentially incompatible) one
- hide_on_bush 1y agoFair point, but we often do "fat morphs", i.e. patching the whole <body> element because this one isn't going anywhere.
- CraigJPerry 1y agoI was late to the hypermedia party, started with datastore but now use HTMX when i want something in this space. The datastar api is a bit nicer but htmx 2.0 supports the same approach, the key thing is what htmx calls OOB updates, with that in place, everything else is a win in the htmx column.
- gwd 1y agoOne frustration I have with OOB elements in HTMX: 1. If the element is out-of-band, it MUST have `htmx-swap-oob="true"` in it, or it may be discarded / cause unexpected results 2. If the element is not out-of-band, it MUST NOT have `htmx-swap-oob="true"` in it, or it may be ignored. This makes it hard to use the same server-side HTML rendering code for for a component that may show up either OOB or not; you end up having to pass down "isOob" flags, which is ugly and annoying.
- leg100 1y agoI think Datastar has the better approach here with making OOB the default. I suspect HTMX's non-OOB default makes more sense for very simple requirements where you simply replace the part of the DOM from which the action was triggered. But personally, situations where OOB is necessary is more typical. Interestingly, elements sent via the HTMX websocket extension [1] do use OOB by default. [1]: https://htmx.org/extensions/ws/ https://htmx.org/extensions/ws/
- yawaramin 1y agoThis really depends on your server-side HTML rendering approach. I have a library in which I can do this: node +@ Hx.swap_oob "true" And this adds the `hx-swap-oob=true` attribute to the given node. It makes it trivial to add on any defined markup in an oob swap. I get that many people prefer template-based rendering, but imho to extract the maximum power from htmx an HTML library that's embedded directly in your programming language is much more powerful. https://github.com/yawaramin/dream-html/blob/f7928616b9ca1d6c002714d9544f8459d220273d/app/app.ml#L5 https://github.com/yawaramin/dream-html/blob/f7928616b9ca1d6...
- bilekas 1y agoI don't see a good enough reason to move over from Htmx, unless im missing something you're just moving more lines to the server side. At this point why not just bite the bullet and go back to the old days of php serving html. "Look mom, 0 lines of markup"
- nasretdinov 1y agoUnironically PHP serving HTML wasn't that bad apparently
- sznio 1y ago>At this point why not just bite the bullet and go back to the old days of php serving html. Going back to it is the point. HTMX lets you do that while still having that button refresh just a part of the page, instead of reloading the whole page. It's AJAX with a syntax that frees you from JS and manual DOM manipulation. I fairly recently developed an app in PHP, in the classic style, without frameworks. It provided me with stuff I remembered, the $annoyance $of $variable $prefixes, the wonky syntax, and a type system that makes JS look amazing -- but it still didn't make me scream in pain and confusion like React. Getting the app done was way quicker than if any JS framework was involved. Having two separate but tightly integrated apps is annoying. HTMX or any other classic web-dev approaches like PHP and Django make you have one app, the backend. The frontend is the result of executing the backend.
- nchmy 1y agoALL OF THE LINES ARE ON THE SERVER FOR BOTH OF THEM! That's what ssr html is! Both are just small javascript libraries that allow you to do some interactive stuff declarative in your ssr html. But Datastar is smaller, simpler, more powerful and closer to web standards.
- leg100 1y ago> ...To accomplish this, most HTMX developers achieve updates either by “pulling” information from the server by polling every few seconds or by writing custom WebSocket code, which increases complexity. This isn't true. HTMX has native support for "pushing" data to the browser with Websockets or SSE, without "custom" code.
- gdcbe 1y agoHtmx got me into hypermedia heaven, but it lead me to datastar for sure. Recently we also had an interview with the creator of datastar, where he also talked a bit about darkstar (something he wants to built on top of webtransport for the few things where datastar is no well suited for now) https://netstack.fm/#episode-4 https://netstack.fm/#episode-4
- wolfgangbabad 1y agoBe careful with Datastar. If the paid "PRO" features are not enough to warn you let me just say that I had a very unfortunate encounter with the author. I asked about how to do something like wire:navigate in Livewire and he told me that's not necessary and I don't understand Datastar and I should go fuck off. He was very ad hominem and aggressive. Won't use his product ever.
- gigatree 1y agoExcuse me but based on your post history I have to imagine it came out of nowhere
- wolfgangbabad 1y agoYou are wrong. A few months ago before the Pro announcement I was exploring HTMX, Unpoly and Datastar was the new thing. It looked cool - especially the demo of a game like thingy. But the page was kind of unresponsive still. This is a common pattern among even Liveview pages where the server roundtrip is still a thing unlike in a typical SPA despite it beings using SSE it's still not local React/Svelte/Vue app experience. That's why you will end up moving more and more parts to Alpine from Livewire/Liveview .... anyway.... I asked the guys on the Discord channel for Datastar how would I do the spa like page navigation between pages. And he got irritated - probably because this wasn't the first time somebody asked that - and told me that I don't get Datastar that that is wrong, Datastar don't care about that. But it was in a such weird aggressive way , he was mociking me, my intelligence and used very childish ad hominem attacks. I then left. And ok, he doesn't like the spa navigation or datastar doesn't care with that at all, but the way he addressed via an attack on me was super negative. You don't call people idiots because they would like from Datastar a functionality that is common in HTMX, Unpoly, Liveview or Livewire. Perhaps they have something like that - or in the PRO version, but I don't care. If you want realtime go with Phoenix Liveview instead - their community is much more friendly and mature.
- sudodevnull 1y agoWe don't shy away from telling you your ideas are terrible. Being mature is caring about your code and your users. You were VERY clearly making bad technically reasons and we pushed back. We aggressively care about the details and if you don't then please go use Liveview. We aren't trying to win popularity contests. Show code and prove your point or continue to clutch your pearls
- adlpz 1y agoI may be just completely out of my depth here, but I look at the cool example on their website, the Open the pod bay doors, HAL bit, and I don't like it, at all. And reading comments one would think this is some amazing piece of technology. Am I just old and cranky or something? This feels... very hard to reason about. Disjoint. You have a front-end with some hard-coded IDs on e.g. <div>s. A trigger on a <button> that black-box calls some endpoint. And then, on the backend, you use the SDK for your choice language to execute some methods like `patchElements()` on e.g. an SSE "framework" which translates your commands to some custom "event" headers and metadata in the open HTTP stream and then some "engine" on the front-end patches, on the fly, the DOM with whatever you sent through the pipe. This feels to me like something that will very quickly become very hard to reason about globally. Presentation logic scattered in small functions all over the backend. Plus whatever on-render logic through a classic template you may have, because of course you may want to have an on-load state. I'm doing React 100% nowadays. I'm happy, I'm end-to-end type safe, I can create the fanciest shiny UIs I can imagine, I don't need an alternative. But if I needed it, if I had to go back to something lighter, I'd just go back to all in SSR with Rails or Laravel and just sprinkle some AlpineJS for the few dynamic widgets. Anyway, I'm sure people will say that you can definitely make this work and organize your code well enough and surely there are tons of successful projects using Datastar but I just fail to understand why would I bother.
- jakubmazanec 1y agoI share your feelings. If you like React and its trade-offs, and you're comfortable using it (based on various HN discussion the easiest sign is that you're able to understand the concept of hooks and you don't have the need to wrongly yell everywhere how it's a bad abstraction :D), you can forget about Datastar or HTMAX.
- spoiler 1y agoFor context, I worked with large React codebases, contributed to various ecosystem libraries (a few bigger ones: react-redux, styled components, react-router). So, I'm pretty comfortable with hooks, but I still make mistakes with them if React isn't in my daily routine (different day job now, only use React occasionally for some pet projects). I've also onboard interns and juniors onto React codebase, and there's things about React that only really make sense if you're more old-school and know how different types behave to understand why certain things are necessary. I remember explaining to an intern why passing an inlined object as a prop was causing the component to rerender, and they asked whether that's a codebase smell... That question kinda shocked me because to me it was obvious why this happens, but it's not even a React issue directly. Howeve the fix is to write "un-javascripty" code in React. So this persons intro to JS is React and their whole understanding of JS is weirdly anchored around React now. So I totally understand the critique of hooks. They just don't seem to be in the spirit of the language, but do work really well in spite of the language. As someone who survived the early JS wilderness, then found refuge in jQuery, and after trying a bunch of frameworks and libraries, finally settled on React: I think React is great, but objectively parts of it suck, and it's not entirl its fault
- tecleandor 1y agoI've heard good things about Unpoly too. Any experiences around here?
- b0ner_t0ner 1y agoI find Unpoly easier to use than HTMX, their demo is second-to-none: https://demo.unpoly.com/ But absolutely terrible name.
- fhackenberger 1y agoFunny, the next cycle is starting ;-) I remember Vaadin which was a great framework just before angularJS took off. Now Datastar seems to give it another try and bring everyone back to server calls...
- sudodevnull 1y agoI really like the ideas of hmx I just didn't find the actual implementation was complete enough to make performant apps... So I fixed it
- David-Guillot 1y agoThanks to Chris to continue challenging his comfort zone (and mine!) and sharing his impressions and learnings with us! I may be a little biased because I've been writing webapps with htmx for 4 years now, but here are my first thoughts: - The examples given in this blogpost show what seems to be the main architectural difference between htmx and Datastar: htmx is HTML-driven, Datastar is server-driven. So yes, the API on client-side is simpler, but that's because the other side has to be more complex: on the first example, if the HTML element doesn't hold the information about where to inject the HTML fragment returned by the server, the server has to know it, so you have to write it somewhere on that side. I guess it's a matter of personal preference then, but from an architecture point-of-view both approaches stand still - The argument of "less attributes" seems unfair when the htmx examples use optional attributes with their default value (yes you can remove the hx-trigger="click" on the first example, that's 20% less attributes, and the argument is now 20% less strong) - Minor but still: the blogpost would gain credibility and its arguments would be stronger if HTML was used more properly: who wants to click on <span> elements? <button> exists just for that, please use it, it's accessible ;-) - In the end I feel that the main Datastar selling point is its integration of client-side features, as if Alpine or Stimulus features were natively included in htmx. And that's a great point!
- melvinroest 1y agoReminds me a bit of the Seaside framework in Pharo. A lot of the things I programmed in Pharo at my previous employer was a lot of back and forth between front-end and back-end, because the back-end was managing the front-end state. For B2B apps that don't have a lot of latency requirements, etc., I'd say it's better. For high scalable B2C apps though? No.
- swores 1y agoCould you expand on why you think it (back-end managing the front-end's state) is better in the scenarios that you do? Edit - rather than spam with multiple thank you comments, I'll say here to current and potential future repliers: thanks!
- maelito 1y ago> Since then, teams everywhere have discovered the same thing: turning a single-page app into a multi-page hypermedia app often slashes lines of code by 60% or more while improving both developer and user experience. Well, not at all. The only compelling reason for me to use server-side rendering for apps (not blogs obviously,they should be HTML) is for metadata tags. That's why I switched from pure React and everything has been harder, slower for the user and more difficult to debug than client-side rendering.
- leg100 1y agoI don't think the article does a good job of summarising the differences, so I'll have a go: * Datastar sends all responses using SSE (Server Side Events). Usually SSE is employed to allow the server to push events to the client, and Datastar does this, but it also uses SSE encoding of events in response to client initiated actions like clicking a button (clicking the button sends a GET request and the server responds with zero or more SSE events over a time period of the server's choice). * Whereas HTMX supports SSE as one of several extensions, and only for server-initiated events. It also supports Websockets for two-way interaction. * Datastar has a concept of signals, which manages front-end state. HTMX doesn't do this and you'll need AlpineJS or something similar as well. * HTMX supports something called OOB (out-of-band), where you can pick out fragments of the HTML response to be patched into various parts of the DOM, using the ID attribute. In Datastar this is the default behaviour. * Datastar has a paid-for Pro edition, which is necesssary if you want certain behaviours. HTMX is completely free. I think the other differences are pretty minor: * Datastar has smaller library footprint but both are tiny to begin with (11kb vs 14kb), which is splitting hairs. * Datastar needs fewer attributes to achieve the same behaviours. I'm not sure about this, you might need to customise the behaviour which requires more and more attributes, but again, it's not a big deal.
- nchmy 1y agosome quibbles D* doesnt only use SSE. It can do normal http request-response as well. Though, SSE can also do 0, 1 or infinite responses too. Calling datastar's pro features "necessary" is a bit disingenuous - they literally tell people not to buy it because those features, themselves, are not actually necessary. Theyre just bells and whistles, and some are actually a bad idea (in their own words). Datastar is 11kb and that includes all of the htmx plugins you mentioned (sse, idiomorph) and much more (all of alpine js, essentially).
- leg100 1y ago> Calling datastar's pro features "necessary" is a bit disingenuous I didn't. I said: > * Datastar has a paid-for Pro edition, which is necesssary if you want certain behaviours. HTMX is completely free. I don't need to spell out why this means something very different to what you think it means. I'll happily concede on the other two quibbles.
- tankaiji 1y agoI thought returning html from server was considered mixing up separation of concerns… oh well
- hshdhdhehd 1y agopartial html? Returning html from a server is... just the WWW.
- nchmy 1y agoThis website that we are communicating on returns html from the server. That's how the web works
- tankaiji 1y agoOh I guess I missed the point. So everything is rendered on server and even templating is on server side. Fair.
- pragma_x 1y agoThat's... no, servers sending HTML to the client was where we started with all this. That's why the H in HTTP and in HTML stand for "Hypertext." Any time a webserver replies with something other than markup, _that's_ the extension/exception to that very old design. Now, if you're talking about the separation of user-interface, data, logic, and where HTML fits in, that's a much bigger discussion.
- andersmurphy 1y agoFantastic write up! For those of you who don't think Datastar is good enough for realtime/collaborative/multiplayer and/or think you need any of the PRO features. These three demos each run on a 5$ VPS and don't use any of the PRO features. They have all survived the front page of HN. Datastar is a fantastic piece of engineering. - https://checkboxes.andersmurphy.com/ https://checkboxes.andersmurphy.com/ - https://cells.andersmurphy.com/ https://cells.andersmurphy.com/ - https://example.andersmurphy.com/ https://example.andersmurphy.com/ (game of life multiplayer) On both the checkboxes/cells examples there's adaptive view rendering so you can zoom out a fair bit. There's also back pressure on the virtual scroll.
- liotier 1y ago> think you need any of the PRO features Pro features ? Now I see - it is open core, with a $299 license. I'll pass.
- andersmurphy 1y agoGood for you! I don't use anything from pro and I use datastar at work. I do believe in making open source maintainable though so bought the license. The pro stuff is mostly a collection of foot guns you shouldn't use and are a support burden for the core team. In some niche corporate context they are useful. You can also implement your own plugins with the same functionality if you want it's just going to cost you time in instead of money. I find devs complaining about paying for things never gets old. A one off life time license? How scandalous! Sustainable open source? Disgusting. Oh a proprietary AI model that is built on others work without their consent and steals my data? Only 100$ a month? Take my money!
- deleted 1y ago[deleted]
- rvitorper 1y agoIt is 299$ lifetime. It is extremely cheap
- wild_egg 1y ago
- reverseblade2 1y agoLast time I checked both have questionable shadow dom support if any
- sudodevnull 1y agoUse webcomponents all the time
- nchmy 1y agoto elaborate on this for others, the datastar homepage has webcomponents such as the starfield animation at the top. And they;re releasing a fantastic web component framework/tool soon called Rocket. It'll be like Lit, but simpler, better and integrated with the rest of datastar
- brokegrammer 1y agoI don't understand the examples in this post. For example, how does: <span hx-target="#rebuild-bundle-status-button" hx-select="#rebuild-bundle-status-button" hx-swap="outerHTML" hx-trigger="click" hx-get="/rebuild/status-button"></span> Turn into: <span data-on-click="@get('/rebuild/status-button')"></span> The other examples are even more confusing. In the end, I don't understand why the author switched from HTMX to Datastar.
- youngtaff 1y agoAlso why is it a span instead of a button or link?
- bwklein 1y agoMy guess is to demonstrate that any element can be interactive with D*, not just buttons or links.
- csande17 1y agoBasically, the HTMX code says: "when this span is clicked, fetch /rebuild/status-button, extract the #rebuild-bundle-status-button element from the returned HTML, and replace the existing #rebuild-bundle-status-button element with it". The Datastar code instead says: "when this span is clicked, fetch /rebuild/status-button and do whatever it says". Then, it's /rebuild/status-button's responsibility to provide the "swap the existing #rebuild-bundle-status-button element with this new one" instruction. If /rebuild/status-button returns a bunch of elements with IDs, Datastar implicitly interprets that as a bunch of "swap the existing element with this new one" instructions. This makes the resulting code look a bit simpler since you don't need to explicitly specify the "target", "select", or "swap" parts. You just need to put IDs on the elements and Datastar's default behavior does what you want (in this case).
- lunar_mycroft 1y agoNote that for this example you can get the same behavior (assuming the endpoint hit isn't using using SSE, which IMO Datastar over emphasizes) in HTMX via a combination of formatting your response body correctly and the response headers. It isn't the way things are typically done in HTMX for Locality of Behavior reasons, not because it's impossible.
- afavour 1y agoTwo posts about one, lesser known, framework in the top two spots of HN. It smells of rigging.
- sudodevnull 1y agoDatastar author here, all this happened while I was asleep so yeah I'm really good at reading the system in my dreams. I must be actually AGI and totally not a real person. Highly suspect
- inanothertime 1y ago> They converted it from React to HTMX, cutting their codebase by almost 70% while significantly improving its capabilities. Happy user of https://reflex.dev https://reflex.dev framework here. I was tired of writing backend APIs with the only purpose that they get consumed by the same app's frontend (typically React). Leading to boilerplate code both backend side (provide APIs) and frontend side (consume APIs: fetch, cache, propagate, etc.). Now I am running 3 different apps in productions for which I no longer write APIs. I only define states and state updates in Python. The frontend code is written in Python, too, and auto-transpiled into a React app. The latter keeping its states and views automagically in sync with the backend. I am only 6 months into Reflex so far, but so far it's been mostly a joy. Of course you've got to learn a few but important details such as state dependencies and proper state caching, but the upsides of Reflex are a big win for my team and me. We write less code and ship faster.
- gdulli 1y agoI checked this out because it sounded cool and I was not expecting to see a landing page about AI and "Contact sales" for pricing info if you don't want your work to be data-mined. 2025, man. Sigh.
- ggregoire 1y ago> I was tired of writing backend APIs with the only purpose that they get consumed by the same app's frontend PostgREST is great for this: https://postgrest.org https://postgrest.org I run 6 React apps in prod, which used to consume APIs written with Falcon, Django and FastAPI. Since 2 years ago, they all consume APIs from PostgREST. I define SQL views for the tables I want to expose, and optionally a bunch of SQL grants and SQL policies on the tables if I have different roles/permissions in the app, and PostgREST automatically transforms the views into endpoints, adds all the CRUD + UPSERT capabilities, handles the authorization, filtering, grouping, ordering, insert returning, pagination, and so on.
- darnthenuggets 1y agoDespite the “just figure it out” style of documentation, I still believe Hotwire + Stimulus (optional honestly) to be the best iteration of the low-JavaScript reactivity bunch. Htmx gives me bad vibes from having tons of logic _in_ your html. Datastar seems better in this respect but has limitations Hotwire long since solved.
- intrasight 1y ago>Htmx gives me bad vibes from having tons of logic _in_ your html Write some HTMX and you'll find that exactly the opposite is true
- andersmurphy 1y agoI'd love to hear what those limitations are as someone who came from Hotwire and moved to Datastar.
- taffer 1y ago> tons of logic _in_ your html That is not at all what HTMX does. HTMX is "If the user clicks[1] here, fetch some html from the server and display it". HTMX doesn't put logic in your HTML. [1] or hovers or scrolls.
- gloosx 1y agoThese "we cut 70% of our codebase" claims always make me laugh. We have no idea what was going on in that original codebase. The talk literally shows severely cursed lines stretching to the moon like: <div hx-get="{% url 'web-step-discussion-items-special-counters' object.bill_id object.pk %}?{{ request.GET.url...who knows how many characters long it is. It's hard to tell whether they optimised the app, deleted a ton of noise, or just merged everything into those 300-character-long megalines.
- pas 1y ago... but the whole social movement of "back to the backend" is about getting rid of the client-side application as a separate component of course it (should) lead to a lot less code! at the cost of completely foregoing most of the capabilities offered by having a well-defined API and a separate client-side application ... and of course this is happening as over the last ~2 decades we mostly figured out that most of that amazing freedom on the client-side does not worth it ... most clients are dumb devices (crawlers), most "interactions" are primitive read-only ones, and having a fast and simple site is a virtue (or at least it makes economic sense to shunt almost all complexity to the server-side, as we have fast and very capable PoPs close to users)
- lnenad 1y ago> ... and of course this is happening as over the last ~2 decades we mostly figured out that most of that amazing freedom on the client-side does not worth it It's not that, at least in my opinion, it's that we love (what we perceive as) new and shiny things. For the last ten years with Angular, React, Vue et al., new waves of developers have forgotten that you can output stuff directly from the server to the browser outside of "APIs". This implementation is "dumb" to me. Feels like the only innovation is using SSE, otherwise it's a `selector.onClick(() => {selector.outerHTML = await (fetch(endpoint)).json()});`. That's most of the functionality right there. You can even use native HTML element attributes instead of doing .onClick https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event https://developer.mozilla.org/en-US/docs/Web/API/Element/cli.... I really don't see any benefit to using this.
- qwertox 1y ago"Why I switched from HTMX to Datastar" -> Why I never switched to HTMX, because there will always be something better, and for that there also will be something better. Or the then backwards-incompatible HTMX v2 will give it the rest, leaving all the obsolete codebase. It's the circle of life.
- npodbielski 1y agoDuring 2015-2018 I was not working on FE and when I started again everyone was using js frameworks ditching MVC, aspx and similar. Now I again not working on the FE for 3 years and it seems everybody is going back to sending HTML from server. I am not saying it is wrong. Just it is abit funny looking from perspective how pendulum is going now the other way.
- pprotas 1y agoWhat you see on hackernews/twitter is not what everybody is doing. Reality is that everyone is still rawdogging React in their legacy app
- sureglymop 1y agoReality is that they are rawdogging angular, probably with a java backend.
- codeulike 1y agoI'm really enjoying watching everything revert back to how it worked fifteen years ago
- sudodevnull 1y agoThat's kind of the point. Don't throw out the new modern features of the browser but use them with fine-grainer activity. Otherwise most of the state lives in the back end. It's really just getting back to normalcy
- deleted 1y ago[deleted]
- agos 1y agoI’m just waiting for the people remembering why we changed things fifteen years ago
- sodapopcan 1y agoI'm really just starting with htmx but came across datastar yesterday. This is a great comparison and is confirming some of my impressions, so thanks! I'll still look a bit more but if the main thing is that it's naively adding Alpine or Stimulus then datastar is not for me.
- sudodevnull 1y agoits not like that at all, read the guide and build something before passing judgement
- sodapopcan 1y ago:pointing-up-emoji: > I'll still look a bit more
- fgonzag 1y agoI was going to because I like the architecture, but then I saw the fact that licensing changes are going to be frequent, and that the developers seem a bit aggressive on another thread, and I've decided to skip it. Datastar developers are free to do what they want with their code, but as someone who releases open source software, I'm tired of projects using open source simply to create a moat or user base then switch to a proprietary model.
- nutjob2 1y ago> then I saw the fact that licensing changes are going to be frequent What are you referring to here? Sounds important. Edit: Looks like its this < https://drshapeless.com/blog/posts/htmx,-datastar,-greedy-developer.html https://drshapeless.com/blog/posts/htmx,-datastar,-greedy-de... >
- sudodevnull 1y agoNOTHING changed about the license. FUD
- multiplegeorges 1y agoHonestly, seeing the Datastar server-side snippets reminded me of writing RJS in Rails back in the day. Everything old is new again. Having the backend aware of the IDs in the HTML leads to pain. The HTMX way seems a lot simpler and Rails + Turbo has gone in that direction as well.
- mring33621 1y agoi don't know what the big deal is with a REST API, the front and back ends need to agree on the JSON field names with an HTML API for Datastar, the front and back ends need to agree on the element IDs Really not a huge difference
- multiplegeorges 1y agoRight but this isn’t a REST API. This technique specifically rejects that approach. With htmx, the server just returns HTML and the logic for handling it is entirely in the front end.
- Twey 1y agoOne of the big promises of HTMX is that the client doesn't have to understand the structure of the returned data since it's pre-compiled to the presentation layer, and it feels like this violates that quite heavily since now the calling page needs to know the IDs and semantics of the different elements the server will return. This isn't really a criticism of Datastar, though: I think the popularity of OOB in HTMX indicates that the pure form of this is too idealistic for a lot of real-world cases. But it would be nice if we could come up with a design that gives the best of both worlds.
- andersmurphy 1y agoThe calling page knows nothing, you do an action on the client, the server might return an update view of the entire page. That's it. You send down the whole page on every change. The client just renders. It's immediate mode like in video games.
- Twey 1y agoThat doesn't seem to be the ‘standard’ way to use Datastar, at least as described in this article? If one were to rerender the entire page every time, what's the advantage of any of these frameworks over just redirecting to another page (as form submissions do by default)?
- andersmurphy 1y agoIt's the high performance way to use Datastar and personally I think it's the best DX. 1. It's much better in terms of compression and latency. As with brotli/zstd you get compression over the entire duration of the connection. So you keep one connection open and push all updates down it. All requests return 204 response. Because everything comes down the same connection brotli/zstd can give you 1000-8000x compression ratios. So in my demos for example, one check is 13-20bytes over the wire even though it's 140k of HTML uncompressed. Keeping the packet size around 1k or less is great for latency. Redirect also has to do more trips. 2. The server is in control. I can batch updates. The reason these demo's easily survive HN is because the updates are batched every 100ms. That means at most a new view gets pushed to you every 100ms, regardless of the number of users interacting with your view. In the case of the GoL demo the render is actually shared between all users, so it's only rendering once per 100ms regardless of the number of concurrent users. 3. The DX is nice and simple good old View = f (state), like react just over the network.
- bamazizi 1y agoI had a SaaS project last year with massive HTMX code base. Code was big and pain was even bigger. A few months back I attempted to convert parts of it to DataStar but the introduction of premature "DataStar Pro" and putting pretty basic but essential utilities behind the paywall killed the vibe. I scrapped the idea and wouldn't go near it. Having just watched the Vite documentary both HTMX and DataStar have a higher order mission to challenge dominant incumbent JS frameworks like React/NextJS. HTMX is struggling and in my opinion Datastar is DOA! Win the adoption, win the narrative then figure out cashing in. People behind Vite won the JS bundling race, they now have a new company Void(0) and raised venture money. NextJS solved major React pain points, gave it away for free and built a multi-billion$ infrastructure to host it.
- sudodevnull 1y agoDOA! NGMI! Should just give up cause popular stuff is popular! Sorry I care more about metrics and flamegraphs than what tech youtuber is faffing on about.
- nchmy 1y agosurely this is missing a /s at the end... surely...
- hmans 1y ago[dead]
- deleted 1y ago[deleted]
- wackget 1y agoGenuine question from an "old school" web developer: can someone please give me an example of where these new frontend technologies are actually better than just using HTML, CSS, and vanilla JavaScript or jQuery? I have honestly yet to see an example where using something like React doesn't just look like it's adding unnecessary complexity.
- sodapopcan 1y agoThese tools are absolutely nothing like React. Take a look at what htmx does, which is even simpler from a spec standpoint. There are actual on-going efforts to get it into the actual HTML spec. htmx and the like are basically built for us old-skool types (and thankfully many youngins are catching on).
- sudodevnull 1y agoif it's simpler why is it so much more code and slower with less features?
- sodapopcan 1y agoNot sure what you mean by so much more code. Datastar seems to do more than htmx. Otherwise, there are less features because React and friends over-complicate things for the vast majority of use-cases.
- sudodevnull 1y agoDatastar is 40% smaller than HTMX even before you add SSE or Alpine or JS head support, etc.
- sodapopcan 1y agoOhhhhh I thought you meant simpler than React, lol. Gotcha. I was going by what it does, not line of code of the implementation, which is what matters in this context (a skeptic looking to check something out quickly).
- tamimio 1y ago>datastar I have never heard of it, but I loved it reading a bit of the docs, especially as someone who doesn't like the whole front end circus! I was planning to teach myself svelte but it seems this one is more than enough!
- ttecho 1y agoDatastar has been great. If you need the pro features you might be doing it wrong.
- nz3000 1y agoI've been using datastar for the last year to much success. The core library is fantastic. I use Go as my backend language of choice, and have a boilerplate project built from examples that were in the original datastar site code. I've also added some extra examples to show how one can build web components that work seamlessly to integrate with JS libs that exist today and drive them from a backend server. If you are looking to understand what's possible when you use datastar and you have some familiarity with Go, I hope this is a solid starting point for you. - https://github.com/zangster300/northstar https://github.com/zangster300/northstar
- dpc_01234 1y agoDoes it now allow handling non-2xx responses in non-SSE actions? Refusing to support it (even as an opt-in) is what made me just look into using alpine + alpinejs instead. SSE in d* is awesome when you have a feature that needs it, but IMO d* completely over-emphasizes and wants you to use it for everything. If I was using d*, I would use it more often, sure. But most of my projects just need little html updates on a click of a button, that's all. I'm not going to change the whole architecture to tailor it to a 1% feature.
- rodolphoarruda 1y agoLot of mentions of HTMX along the comments. If you are interested and have the time, read the the first chapters of this book[1]. Very well written and a bit nostalgic I should say, at least to some of us who had lived the web 1.0 days. [1] https://hypermedia.systems/ https://hypermedia.systems/
- pragma_x 1y ago> One of the amazing things from David Guillot’s talk is how his app updated the count of favored items even though that element was very far away from the component that changed the count. This might not seem like a big deal, but it looks like Datastar dramatically reduces the overhead of a common use-case. The article shows how to update a component and a related count, elsewhere in the UI. A more practical use-case might be to show a toast in tandem with navigating to another view. Or updating multiple fields on a form validation failure.
- rvitorper 1y agoOh my. I didn’t notice that. What usually is a pita, now is a breeze
- some_guy_in_ca 1y agoHere is my take on datastar from htmx https://chrismalek.me/posts/data-star-first-impressions/ https://chrismalek.me/posts/data-star-first-impressions/
- rvitorper 1y agoThat’s interesting. Does it integrate well with Spring Boot?
- throwaway7783 1y agoI like that datastar has better defaults, embracing SSE makes certain things much simpler and cleaner even on the backend (no need to wrangle templates with htmx oob for example). I am okay with the open-core and pro model. But, the maintainers are quite combative on HN and Reddit as well. This does not bode well for the otherwise great project.
- hunvreus 1y agoI'm still trying to figure out what the key difference would be when writing an app with Datastar over HTMX. I wrote /dev/push [1] with FastAPI + HTMX + Alpine.js, and I'm doing a fair bit with SSE (e.g. displaying logs in real time, updating state of deployments across lists, etc). Looking at the Datastar examples, I don't see where things would be easier that this [2]: <div hx-ext="sse" sse-connect="{{ url_for('project_event', team_id=team.id, project_id=project.id) }}" sse-close="sse:stream_closed" > <div hx-trigger="sse:deployment_creation, sse:deployment_status_update, sse:deployment_rollback, sse:deployment_promotion" hx-get="{{ url_for('project_deployments', team_slug=team.slug, project_name=project.name).include_query_params(fragment='deployments') }}" hx-target="#deployments" ></div> </div> Also curious what others think of web components. I tried to use them when I was writing Basecoat [3] and ended up reverting to regular HTML + CSS + JS. Too brittle, too many issues (e.g. global styling), too many gaps (e.g. state). [1]: https://devpu.sh https://devpu.sh [2]: https://github.com/hunvreus/devpush/blob/main/app/templates/project/partials/_sse-deployments.html https://github.com/hunvreus/devpush/blob/main/app/templates/... [3]: https://basecoatui.com https://basecoatui.com
- hunvreus 1y agoBTW, this comment is very true when dealing with HTMX as well: > But what I’m most excited about are the possibilities that Datastar enables. The community is routinely creating projects that push well beyond the limits experienced by developers using other tools. For example when displaying the list of deployments, rather than trying to update any individual deployment as their state is updated, it's just simpler to just update the whole list. Your code is way simpler/lighter as you don't need to account for all the edge case (e.g. pager).
- daninus14 1y agoHas anyone here actually written a large app using data star? How does it compare with react in managing code complexity? Dealing with many concurrent users? can you tell us about your experience?