Mithril.js Interview with Gilbert

Gilbert is an instructor at MakerSquare, where I studied software engineering. I wanted to ask him some questions about Mithril.js (a JavaScript framework) and I thought I would share his answers here for the benefit of all. Also, Gilbert has an excellent tutorial about getting started with Mithril.


How did you find Mithril, and what was it that intrigued you about it?One of my programming buddies linked me to it a long time ago. I saw it, and thought it was “interesting”, but didn’t look into it any further. It wasn’t until much later when I was fed up with JavaScript and its popular frameworks that I took another look and discovered its beautiful simplicity. That day changed my perspective on both JavaScript and front end development.

Could you talk a little bit about the landscape of JavaScript frameworks, and how Mithril fits into that? Front end JavaScript has quite a history. I started web development about seven years ago, when the JS world consisted of jQuery vs Prototype.js vs Mootools.js (I was a Mootools fan). Those were simple times, a time when you rendered everything server-side, and included something like jQuery for an image slider or a dash of user interaction. There were only a handful of browsers, IE6 was the most popular, and there was no mobile. jQuery and the like were important because they handled the breaking differences in JavaScript between different browsers.

As time went on, JavaScript in the browser was becoming more and more common, and one day, Backbone.js became the new hotness. Web developers — probably a majority of which were new to the field of programming — were convinced that using jQuery alone led to spaghetti code, and Backbone was touted as the solution. Being an inexperienced developer myself, I jumped onboard, and ended up writing a lot of Backbone apps. In hindsight I’ve realized that Backbone doesn’t actually do very much for you. It actually encourages some poor practices (making everything observables, for instance), and in the end it doesn’t help make your code any more concise.

Next came Angular. Backed by Google, Angular’s two-way data binding demo took JS pop culture by storm. Frustrated with my experiences with maintaining large Backbone apps, I took a lesson from history and avoided investing any time learning Angular (in hindsight this was a good idea). The ideas behind Angular 1.0 came from the Java enterprise world, are by no means idiomatic, and — according to other developers — its performance turned out to be hard to debug in large applications (ironically because of two-way data binding, the very feature that made it popular).

Nowadays, the new hotness is React.js. And to be honest, it’s actually quite decent. It employs a Virtual DOM that yields benefits in speed and code maintainability. However, React.js still has some object-oriented programming roots (JavaScript is, at heart, a functional language), and JSX is practically a required dependency if you don’t want your code to look awfully verbose.

Virtual DOM is the future, however; Mithril.js makes use of this same technique. It’s very similar to React, except that it does a bit more and is much smaller (about 5kb gzipped). The best part is that there is no JSX, no precompilers, no arbitrary HTML-ish language, nothing — it’s just JavaScript.

What are Mithril’s greatest strengths? I believe one of Mithril’s greatest strengths is its low learning curve. You only have to learn three or so methods to get started, yet you can do so much. I think a framework with a low learning curve is vastly underrated. When something is easy to learn, you’ll have a much easier time hiring other developers and getting them up to speed. Not to mention reading your own code months down the line ☺

What are some of Mithril’s weaknesses? I wouldn’t say this is a weakness, but it is something that scares developers off: writing your views in JavaScript (instead of HTML). Back in my jQuery days, it was complete taboo to attach an event handler directly onto an HTML element.

// taboo  
<div onclick="showModal(event)" />

That taboo was so prevalent, so strong that it affects developers even today; when some look at how Mithril handles views, they get a chill sense of the past, and immediately dismiss the framework altogether. I was wary myself — it was probably the reason I didn’t get into Mithril the first time my friend linked me to it. In the end, though, views need logic to be useful (view logic, not business logic). Inventing a pseudo-html language like Angular’s only adds another layer of complexity to learn, debug, and maintain.

One potential weakness of Mithril is that it doesn’t prescribe anything for your Model in MVC. If thinking about code design and patterns makes you uncomfortable, you might want to wait until someone releases an opinionated framework that sits on top of Mithril.

You’re involved in the Mithril community. What are some of the most notable recent changes (or impending changes)? True, I am involved in a lot of Mithril’s feature discussions. If you hang out in the gitter chat room, you’ll find people discussing and posting a lot of really neat patterns. You can also ask for help; me and others are very willing to help you get started.

Just recently Mithril released support for nesting components. This makes it super easy to build a top-down component architecture. It was the one ingredient that I missed from using React.js.

What are some more advanced things you’ve done with Mithril that you think are really cool? One day I was working on a client project that needed functionality similar to datatables. After wrestling with the library for hours, I got fed up with it. When I think about it, it’s funny how as I become more experienced, I become less tolerant of certain kinds of programming hurdles — in this case, poorly designed APIs. There’s just not enough time in the day to deal with things that should not be this difficult.

Anyways, suddenly I had the thought, “wait, this wouldn’t be that hard to implement in Mithril, would it”? I decided to do it, and at the end of the day I had datatables-like functionality in my client’s project, complete with AJAX and pagination.

What are some other technologies that pair really well with Mithril?Anything that is not a framework, to be honest. Because Mithril does not dictate how you write code, it’s easy to integrate other JavaScript libraries. You’ll run into some friction if you use a library that heavily relies on the DOM for state, but that’s an anti-pattern anyway.

Besides the docs and your own tutorial, what are some of the best resources for learning more about Mithril? There is now a wiki that is actively maintained by the community. One of the wiki pages has a list of tutorials on getting started.