←back to thread

Show HN: Aberdeen – An elegant approach to reactive UIs

(aberdeenjs.org)
224 points vanviegen | 6 comments | 09 May 25 12:42 UTC | HN request time: 0.697s | source | bottom

Yes, another reactive UI framework for JavaScript. Bear with me, please... :-)

I 'invented' the concept for this back in 2011, and it was used (as a proprietary lib) in various startups. Even though many similar open source libs have been released since, and boy have I tried a lot of them, none have been able to capture the elegance and DX of what we had back then. I might be biased though. :-)

So I started creating a cleaned-up, modern, TypeScript, open source implementation for the concept about five years ago. After many iterations, working on the project on and off, I'm finally happy with its API and the developer experience it offers. I'm calling it 1.0!

The concept: It uses many small, anonymous functions for emitting DOM elements, and automatically reruns them when their underlying proxied data changes. This proxied data can be anything from simple values to complex, typed, and deeply nested data structures.

As I'm currently free to spend my time on labors of love like this, I'm planning to expand the ecosystem around this to include synchronizing data with a remote server/database, and to make CRUD apps very rapid and perhaps even pleasurable to implement.

I've celebrated 1.0 by creating a tutorial with editable interactive examples! https://aberdeenjs.org/Tutorial/

I would love to hear your feedback. The first few people to actually give Aberdeen a shot can expect fanatical support from me! :-)

1. 90s_dev ◴[09 May 25 14:09 UTC] No.43936965[source]▶
The two downsides you list ("lack of community" and "lack of ecosystem") are not really downsides. If something is good enough, people will simply adopt it out of excitement, and those two problems will disappear entirely. See Rust and React.

This looks and sounds incredibly clever, and seems to be what I always wanted React to be. I'm eager to try it out!

Could you make a demo of a simple Todo list app in it that lets you edit items, toggle them complete individually, inverse all items, and delete all done items? That way we can see how this works with relatively complex hierarchies.

replies(3): >>43937348 #>>43937524 #>>43942344 #
2. vanviegen ◴[09 May 25 14:43 UTC] No.43937348[source]▶
Thanks!

Yeah, creating a todo-list demo was actually on my, eh... todo-list! :-)

I'll probably implement this one soon: https://todomvc.com/

replies(1): >>43946315 #
3. throw10920 ◴[09 May 25 14:59 UTC] No.43937524[source]▶
> "lack of community" and "lack of ecosystem"

Yes, those absolutely are downsides - they materially affect my choice, as a developer, to use the framework or not.

The fact that they're solvable doesn't make them not negative. Other frameworks could solve their problems, too - that doesn't mean that they aren't problems now.

4. soulofmischief ◴[10 May 25 00:50 UTC] No.43942344[source]▶
I think what you're looking for is mithril. It checks every one of these boxes, except it has a nicer developer experience and still has lifecycle methods, which seem much easier to reason about and test than Aberdeen. Seriously, check it out. You'll be impressed. You can learn the API in a day, and it's super stable and thoughtful. I've been using mithril for a decade and the only time I don't reach for it is if web components solve my problem (smaller projects, non-SPAs)

https://mithril.js.org

replies(1): >>43945261 #
5. 90s_dev ◴[10 May 25 12:57 UTC] No.43945261[source]▶
I used Mithril in a few projects about 13-14 years ago. It was okay.
6. 90s_dev ◴[10 May 25 15:13 UTC] No.43946315[source]▶
I just saw your todo list. One issue is that all the work is done in the view. Suppose I want to toggle or clear items programmatically instead of via UI. This is why I suggested the todo example, because it goes one level deep, which is more than zero, just enough to show-case how the model and view interoperate in a way that's not just the same as backbone.js, which so far this looks exactly like.

[edit]: That's also why I suggested a button to inverse all todo items. This would have forced you to pull some code out of the view constructor for a todo item and I wanted to see where it would go and how it would all connect.