←back to thread

224 points vanviegen | 3 comments | | HN request time: 0.001s | source

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! :-)

Show context
jmull ◴[] No.43937270[source]
> Express UIs naturally in JavaScript/TypeScript

I would disagree there. Conceptually, you're writing reactive HTML and CSS. I think it would be a lot more natural to express HTML and CSS using HTML and CSS (with extensions to add reactivity), not Javascript/Typescript.

(Svelte is an example of this, though it has it other issues, IMO)

replies(1): >>43937316 #
1. vanviegen ◴[] No.43937316[source]
Meh, I think there's nothing magical about the HTML syntax that makes it particularly great for expression DOM structures. Except familiarity of course.
replies(1): >>43938006 #
2. jmull ◴[] No.43938006[source]
It's not a question of HTML's syntax.

1. HTML is a widely implemented standard. What you learn and know about HTML, and what you create with HTML is widely applicable. Not so much for your HTML alternatives, like Aberdeen.

2. HTML is what the browser accepts, which means you end up dealing with it anyway, just with a transformation in between, making things harder. The bigger the transformation the harder it is. To develop with Aberdeen you still need to know HTML, but you also need to know Aberdeen and how it transforms into HTML. And, you typically end up needing to learn how to mentally transform backwards as you debug, e.g., using the browser dev tools, looking at problem HTML, and deciding how to change the Aberdeen code to fix it.

replies(1): >>43938799 #
3. vanviegen ◴[] No.43938799[source]
Those are good points. Two things though:

1. I'd guess that of all the knowledge a web developer accumulates about HTML and CSS over the years, less than 1% concerns HTML's syntax. Everything else still applies.

2. As a client-side JavaScript developer, what you're actually dealing with is usually not HTML, but the DOM. JSX only resembles HTML rather superficially. It gets translated to a series of DOM method calls. HTML itself has no support for event handling, control structures, composition, etc.

That being said, going with pure JavaScript is of course a trade-off that also has downsides, such as indeed familiarity, and not being able to just paste a block of static HTML into your code. (Though there's a tool to help with that: https://aberdeenjs.org/Tutorial/#html-to-aberdeen)