4 ms·
I love Mithril's (and other's) "build a DOM in code" approach. Traditional templating systems are always limited domain-specific languages that add lots of com
by davexunit 11y ago
I love Mithril's (and other's) "build a DOM in code" approach. Traditional templating systems are always limited domain-specific languages that add lots of complexity for things that should be simple, template "partials" and iteration come to mind instantly.
Making the virtual DOM tree a first-class value that can be treated as a persistent data structure is a huge win. Templates are functions that return a virtual DOM node. Rendering a list is a map from Thing -> virtual DOM node. Redundant rendering is avoided with memoization. "Partials" are just functions. The system handles escaping and prevents XSS vulnerabilities by distinguishing plain strings from DOM nodes, which string-based templating systems do not do. All of the complexity and difficulty of working with templating systems goes away when we can just use the usual functional combinators we all know and love to compose views.
On top of Mithril, I recommend working in a functional reactive library (Kefir, Bacon, Rx, whatever else) to make the whole application declarative and functional. Angular just doesn't compose well with other things like Mithril and other primarily functional libraries do. I should really write a blog post on this.
- Touche 11y ago> On top of Mithril, I recommend working in a functional reactive library (Kefir, Bacon, Rx, whatever else) to make the whole application declarative and functional. How are you using an FRP library with Mithril? I thought with vdom libraries you never touch the real DOM.
- davexunit 11y agoMithril allows you to declare callbacks for the various DOM events on the virtual DOM nodes. This is where you glue in the FRP library. A callback will set the current value for one of the roots of the signal graph.
- findjashua 11y agosynthetic events' handlers can publish events to a bus, and you can create observables on the events on the bus. VDom lets you express UI as a function of the state Observables let you express state as a function of user interactions