4 ms·

FWIW, the framework I wrote (Mithril) is a direct product of working on a multiple-man-year Angular codebase and the pains that arise from such a beast. I wrote

by lhorie 12y ago

FWIW, the framework I wrote (Mithril) is a direct product of working on a multiple-man-year Angular codebase and the pains that arise from such a beast. I wrote about that here ( http://lhorie.github.io/mithril-blog/lessons-learned-from-angular.html http://lhorie.github.io/mithril-blog/lessons-learned-from-an... ) On a related topic, I talk about complexity walls (the idea of code that outgrows a framework's zone of comfort) here ( http://lhorie.github.io/mithril-blog/decreasing-cognitive-load.html http://lhorie.github.io/mithril-blog/decreasing-cognitive-lo... ) and there are slides for a presentation I gave a while back that talks about the design decisions that went into Mithril to reduce learning curves. (here: http://lhorie.github.io/mithril-presentation-oct-js-tech-night/ http://lhorie.github.io/mithril-presentation-oct-js-tech-nig... )

easymovet 12y ago
Where does Mithril fit in this stack: RequireJs, Knockout (with components), SammyJS (for routing/browser history and events)? --After doing some reading it looks like it replaces some of knockout and sammy but I'd lose data binding and dependency tracking of knockout.
- lhorie 12y ago
  Mithril is roughly equal in scope to Knockout+Sammy. The small gap between what most frameworks call "bidirectional data binding" and what it actually is in terms of vanilla js can be bridged with simple functions (I talk about that in a slightly more advanced context here: http://lhorie.github.io/mithril-blog/asymmetrical-data-bindings.html http://lhorie.github.io/mithril-blog/asymmetrical-data-bindi... ). Dependency tracking can refer to two things: tracking changes for the purpose of updating the DOM (which Mithril does handle, albeit in a different way), or computed properties (which I personally think are not a good idea, but that you could do w/ an observable library from microjs)
sanityinc 12y ago
Mithril is a tremendous little framework, and Leo has done an exemplary job of writing it, documenting it and blogging about usage patterns and tricks. While declining frequent requests that he cram more functionality into its core, he takes the time to explain the trade-offs, showing a deep understanding of the problem space which gives me confidence to build upon his work. So thanks Leo! Hopefully, in time, more people will realise the "zen" of mithril's minimal approach. In the meantime, interested readers can check out lichess.org, which recently rewrote its impressive UI using mithril.
- dopamean 12y ago
  I work at a coding bootcamp and we recently used Mithril to teach one of our JS units. I was skeptical at first that it would be properly understood by novice developers... boy was I wrong. Mithril is an awesome framework. A breath of fresh air really.
tipiirai 12y ago
Mithril "HTML" syntax is not for my taste: return m("html", [ m("body", [ m("input"), m("button", "Add"), m("table", [ m("tr", [ m("td", [ m("input[type=checkbox]") ]), m("td", "task description"), ]) ]) ]) ]);
- dopamean 12y ago
  Agreed, it's not the best. Maybe you can help come up with something more palatable?
- insin 12y ago
  I did a quick tweak of React's JSX transpiler to output mithril-compatible code [1], as the above was the sort of syntax I was using JSX to get away from! return <html> <body> <input> <button>Add</button> <table> <tbody> <tr> <td><input type="checkbox"/></td> <td>task description</td> </tr> </tbody> </table> </body> </html> [1] https://github.com/insin/msx/ https://github.com/insin/msx/
  - tipiirai 12y ago
    Definitely more readable than Mithril
- istoica 12y ago
  yes man, this abstraction is horror, I hope mithril adheres to something else for declarative tasks a the one above
- rapind 12y ago
  I think it starts to look like HAML / Slim / Jade once you use CoffeeScript. Understandably not for everyone, but I quite like it, and it doesn't mess with your syntax highlighting like JSX does. m "body", m "input" m "button", "Add" m "table", m "tr", m "td", m "input[type=checkbox]" m "td", "task description"

by lhorie 12y ago

easymovet 12y ago

Where does Mithril fit in this stack: RequireJs, Knockout (with components), SammyJS (for routing/browser history and events)? --After doing some reading it looks like it replaces some of knockout and sammy but I'd lose data binding and dependency tracking of knockout.

lhorie 12y ago
Mithril is roughly equal in scope to Knockout+Sammy. The small gap between what most frameworks call "bidirectional data binding" and what it actually is in terms of vanilla js can be bridged with simple functions (I talk about that in a slightly more advanced context here: http://lhorie.github.io/mithril-blog/asymmetrical-data-bindings.html http://lhorie.github.io/mithril-blog/asymmetrical-data-bindi... ). Dependency tracking can refer to two things: tracking changes for the purpose of updating the DOM (which Mithril does handle, albeit in a different way), or computed properties (which I personally think are not a good idea, but that you could do w/ an observable library from microjs)

sanityinc 12y ago

Mithril is a tremendous little framework, and Leo has done an exemplary job of writing it, documenting it and blogging about usage patterns and tricks. While declining frequent requests that he cram more functionality into its core, he takes the time to explain the trade-offs, showing a deep understanding of the problem space which gives me confidence to build upon his work. So thanks Leo! Hopefully, in time, more people will realise the "zen" of mithril's minimal approach. In the meantime, interested readers can check out lichess.org, which recently rewrote its impressive UI using mithril.

dopamean 12y ago
I work at a coding bootcamp and we recently used Mithril to teach one of our JS units. I was skeptical at first that it would be properly understood by novice developers... boy was I wrong. Mithril is an awesome framework. A breath of fresh air really.

tipiirai 12y ago

Mithril "HTML" syntax is not for my taste: return m("html", [ m("body", [ m("input"), m("button", "Add"), m("table", [ m("tr", [ m("td", [ m("input[type=checkbox]") ]), m("td", "task description"), ]) ]) ]) ]);

dopamean 12y ago
Agreed, it's not the best. Maybe you can help come up with something more palatable?
insin 12y ago
I did a quick tweak of React's JSX transpiler to output mithril-compatible code [1], as the above was the sort of syntax I was using JSX to get away from! return <html> <body> <input> <button>Add</button> <table> <tbody> <tr> <td><input type="checkbox"/></td> <td>task description</td> </tr> </tbody> </table> </body> </html> [1] https://github.com/insin/msx/ https://github.com/insin/msx/
- tipiirai 12y ago
  Definitely more readable than Mithril
istoica 12y ago
yes man, this abstraction is horror, I hope mithril adheres to something else for declarative tasks a the one above
rapind 12y ago
I think it starts to look like HAML / Slim / Jade once you use CoffeeScript. Understandably not for everyone, but I quite like it, and it doesn't mess with your syntax highlighting like JSX does. m "body", m "input" m "button", "Add" m "table", m "tr", m "td", m "input[type=checkbox]" m "td", "task description"