Show HN: 0-dependency, granular, min-diff UI view updates with template literals(github.com)

Show HN: 0-dependency, granular, min-diff UI view updates with template literals

https://github.com/i5ik/trolley

3 comments

Instead of a virtual DOM, this uses closures to update parts of a nodes text content, attributes and child nodes. There's a pinch of syntactic sugar to let you add event handlers directly into the template literal, and two dashes of template tag functions: s to provide singletons that can be keyed, and always update their existing slot in the DOM, and c to generate new DOM that you can slot anywhere when you don't need minimal updates or keyed components.

It's inspired by React and Custom Elements and aims to use existing HTML and DOM APIs in the most efficient and tactile (developer friendly) way possible.

If you know your way around DOM, you probably know how to use this.

Apologies on the README, it's a work in progress. This title and comment is a much better description of what it does, where it comes from and why.

Hope you enjoy! Come contribute. If you want to see some examples, check out the tests directory. I'm using this in production for more than 2 years.

zoshi5년 전

Cool. It reminds me of <https://viperhtml.js.org/hyperhtml/documentation/>. I'm a big fan of this approach over React or web components.

graderjs5년 전

Thanks. Yeah that's also a very inspiring micro framework to me. A bunch of people seemed to create new frameworks around the same time, me included, i think in part as a reaction to the main ones.