el

Nice work! I have a no-dependencies project with somewhat similar goals in frameable/el[0], which takes more inspiration from Vue in its interface. WebComponents give us so much, but just not quite enough to be usable on their own without a little bit more on top. Reactivity with observable store and templating with event binding are the big missing pieces. [0]: https://github.com/frameable/el

Very cool! See also El, which is similarly sized, with an arguably more natural reactive interface: https://github.com/frameable/el

Nice writeup. We're working on a framework with similar goals, here: https://github.com/frameable/el Reactivity, composability, templates, etc with no dependencies, in ~150 SLOC.

We built El[0] with the goal of making a minimal framework for building web apps. As a data point, it has a built-in observable store, reactive templates, scoped subset of scss, no dependencies, and can almost fit in a single network packet. [0]: https://github.com/frameable/el

> I could have chosen to rebuild the entire UI as a template string as a function of state, but instead, it is ultimately more performant to create these DOM helper methods and modify what I want. I like the effort, but this is basically admitting defeat. Just naively using template strings and re-rendering the whole app on every change of state _is_ too slow, and so the author falls back instead to rendering via a series of bespoke methods that mix logic and template strings and DOM methods all interspersed. It still has all the shortcomings of 00's-era PHP, or piles of jQuery. It is possible to do one step better than this still with vanilla js, if you use Web Components / custom elements. That way you can have each type of custom element (todo-app, todo-list, todo-item, etc) have its own render function using template strings, and yo

We developed El to be as minimal as possible, while still solving the problem of keeping state and interface in sync: https://github.com/frameable/el It's just ~150 lines / 2kb, and leverages existing browser functionality to accomplish most of the hard parts. Has observability, reactive templates, scoped CSS, no need for a build process, etc.