let count = track(0);
<button onClick={() => @count++}>{@count}</button>
No useState, ref(), .value, $:, or signals.
You could replace `track` with `useState`, or `@` with `$` and it's pretty much the same thing. Whether you use syntax that's explicit or magic symbols you have to look up to understand is a matter of preference, but this does not really set it apart from any other library.Another thing is that this looks like any other framework out there. I think you can map every one of it's features mostly 1-1 to SolidJS. What is the novelty here? The slightly changed js syntax with "component", "@" and "#"?
I would like to see more radical and new ideas in the js space, expecially in this period. Maybe a new take on Elm to get stronger UI stability guarantees. Or even just some very good tooling to reason about very large reactivity graphs at runtime and (maybe also at) compile time.
That said I still appreciate the work and in particular all the effort spent making the new syntax work in all common editors, I see they support vscode, intellij, sublime, ...
Edit: In the actual documentation they provide an llm.txt https://www.ripplejs.com/llms.txt
Most if not all llms are producing Markdown instead of HTML as the primary output. Markdown has a simpler syntax that basically uses fewer tokens compared to HTML Similarly, Ripple appears to express a complex structure in simple terms compared to React or HTML or whatever. No wonder most AI dev tools operate in React with web previews abstracting away the setup process.
Higher abstractions appear to be cost efficient(both training & inference time - output generation). All that is required is to provide the model with a document containing rules about ripplejs(in this case) and go from there...more like llms.txt or agent.md or simply documentation. Any DSL would fit in a single file and easily consumed by a model.
Looking at the samples, it seems Ripple is going the same direction as Mint:
- explicit component definitions
- inlined control flow in HTML tags
- component based styling
- explicit white space handling for element content
- syntax for setting references
I'm not sure why they based it on TypeScript instead of creating a new language completely, since there are a lot of new syntax added (and they have their own extension as well).
If you are looking for something similar, give Mint a try, it has a lot more features, and I'm looking to release 1.0 in the near future.
I still feel the same way about it. Feels like a weird mish mash of React and Svelte. I don't see any good reason to switch to it after working with Svelte and Solid in prod for the past couple of years.
It’s like htmx and jsx teamed up for world domination. I like the component keyword as a first class citizen. I like the bind and event stuff too. Man, I’m going to have to try this.
That's why they need 20 different hooks to do anything.
You want signals in the browser for granular reactivity, and they are making their way there: https://github.com/tc39/proposal-signals