dom-expressions

> This is why both SolidJS and Vue Vapor both have helpers for rendering lists and conditional elements Haven't these tagged template libraries coalesced around the html`<${SomeComponent}><//>` syntax for custom components (including control flow components like Solid's `For` component)? The readme for Ryan Carniato's Lit DOM Expressions library includes this example for instance [1]: const view = html` <table class="table table-hover table-striped test-data"> <tbody> <${For} each=${() => state.data} >${row => html` <tr> <td class="col-md-1" textContent=${row.id} /> <td class="col-md-4"> <a onClick=${[select, row.id]}>${() => row.label}</a> </td> <td class="col-md-1"> <a onClick=${[remove, row.id]}

I wonder how it compares to https://github.com/ryansolid/dom-expressions/tree/main/packa...

What the author is suggesting is something very similar to hyper-dom-expressions[1] as they are used in Solid.js. I've tried using those because they look like a nice vanilla JS solution. What might not be obvious from the start is that all the "reactive" parts of the UI will need to be wrapped with an extra closure, ala `()=>h(...)` sometimes multiple levels deep, otherwise parts of the UI will not get updated when needed. Maybe this is a implementation specific thing to SolidJS but it makes the code look ugly and it was hard to figure out when and where to put the closures. I ended up just using JSX for SolidJS, sometimes you just need to compromise. [1] https://github.com/ryansolid/dom-expressions/tree/main/packa...

Solid is great, you can also use it with hyper dom expressions: https://github.com/ryansolid/dom-expressions

Ryansolid, the author of solidJS has made a small library dedicated to enabling optimally efficient dom writes: https://github.com/ryansolid/dom-expressions It's the core behind Solid.js and he has brillantly ported it to Vue.js making this vue fork on par with solid https://github.com/ryansolid/vuerx-jsx so you would probably benefit from using and contributing to it. Also, where is the github repo of ur project so that I can follow it?

The is a great suggestion. I’ve also learned a lot just from reading the already-merged code of projects I’m interested in, and stepping through git history to see how it evolved. I even frequently do this on my phone when I want time away from the desk. For instance I’ve been super interested in SolidJS[1] for months. I learned from reading the source that a lot of the work is done by its underlying dom-expressions[2] compiler. And in reading its source, I learned enough about JS AST transformation that, when I had a need to do some AST transforms of my own for work, I knew enough to confidently timebox a proof of concept to two hours (and actually finished the work in that time!). All from reading code casually on my phone. Sure, I front-loaded a lot of that work in my free time. But I did it because I was genuinely interested in the pr

You might not have to replace knockout.js the solid framework author actually has implemented a html rendering lib that has bindings for both knockout.js and mobx. You might find it useful https://github.com/ryansolid/dom-expressions.

https://github.com/ryansolid/dom-expressions/tree/master/pac... Looks great!

Check out my library DOM Expressions(https://github.com/ryansolid/dom-expressions#readme) It's almost exactly what you are talking about. The libraries I've written on top (Solid.js, MobX JSX, and KO JSX) are among the fastest on the JS Frameworks Benchmark(https://krausest.github.io/js-framework-benchmark/current.ht...). The future is already here.