JavaScript 是时候使用 Mithril.js 了

justjavac · 2015年09月26日 · 最后由 rupertqin 回复于 2015年10月02日 · 3266 次阅读

Mithril.js 是一个客户端的 JavaScript MVC 框架。

随着 Flarum 也使用了 Mithril,这个小框架在 github 上的 star 数量也已经突破了 4K。

Mithril 是什么?

Mithril 是一个客户端 javascript MVC 框架,即它是一个工具,使应用程序代码分为数据层(Model), UI 层(View),黏合层(Controller)。

Mithril 通过 gzip 压缩后,仅有 12kb 左右,这要归功于 small, focused, API。它提供了一个模板引擎与一个虚拟 DOM diff 实现高性能渲染,还提供了其它高级工具,以及支持路由和组件化。

框架的目标是使应用程序代码更容易组织,可读和可维护,帮助你成为一个更好的开发者。

不像某些框架,Mithril 努力避免将您锁定到某个 web 框架上:您可以尽量少地使用您所需要的框架。

然而,使用其整个工具库可以带来很多好处:学习使用函数式编程和巩固良好的编码实践,OOP 和 MVC 只是其中的一些。

特点

轻量级

  • gzip压缩后仅仅12kb,无依赖
  • 非常少的API,非常容易的学习曲线

鲁棒性

  • 默认安全的模板
  • 层次化的MVC组件(hierarchical)

快速

  • 虚拟DOM和编译模板
  • 智能的重绘系统(redrawing)

入门示例代码

//model 模型
var Page = {
    list: function() {
        return m.request({method: "GET", url: "pages.json"});
    }
};

var Demo = {
    //controller 控制器
    controller: function() {
        var pages = Page.list();
        return {
            pages: pages,
            rotate: function() {
                pages().push(pages().shift());
            }
        }
    },

    //view 视图
    view: function(ctrl) {
        return m("div", [
            ctrl.pages().map(function(page) {
                return m("a", {href: page.url}, page.title);
            }),
            m("button", {onclick: ctrl.rotate}, "Rotate links")
        ]);
    }
};


//initialize 初始化
m.mount(document.getElementById("example"), Demo);

性能

mithrils.js 性能

参考

共收到 7 条回复

鲁棒性 赞一个

看这个项目开发好像不太活跃,是太鲁棒了还是作者已经放弃了? https://github.com/lhorie/mithril.js/commits/next

终于看到有人吹 Mithril 了简直赞。之前有用过一段时间,非常适合的一个应用场景是在局部需要处理大量 UI-state 的地方加入(e.g:在一个传统网站的局部加入一个日历),而且不依赖任何第三方的库/框架。 不过没用过 Mithril 做一整个的 SPA,所以在这方面就不大清楚了。

我后来就跑去用Mithril了。塞到Pipeline里就可以用,功能少也没什么要学的,因为之前学过React所以几乎直接就上手了,和Coffeescript的兼容性也很好。

最近接触了几个前段框架,发点牢骚供大家批判: React什么都要自己DIY,有点像NodeJS和Sinatra,而我更喜欢Rails,宣称解决的问题我经验少没遇到,单向数据流不知道好在哪,immutable state改状态很麻烦但是状态老要改,Flux也不知道在解决什么问题,视频没耐心看。Redux的概念太多看不懂,Dull Component离开了上层的Smart Component也没法用,不含逻辑的Dull Component就是个Partial,没法直接拿来compose。 Ember文档组织的不好而且很匮乏,讲得也不清楚。React的文档就组织得很好一会儿就学会了。 Angular术语太多整个没看懂而且听说2.0变化大怕现在学了白学。看首页看不出解决了什么问题。

前段框架有一种虽然不知道它们在说什么,但感觉好像很厉害的样子。没有一个框架明确写了“Rails有这样这样的问题,而我们的诞生就是为了解决这些问题”。不知道在解决什么问题,结果就像是自己制造问题,然后再宣称自己解决了自己制造的问题。因为我看coding.net的后台就是Angular做的,不知道跟用Rails+Turbolinks高到哪里去了,但是要多写很多js代码,我不喜欢js代码,括号太多了,新时代js代码ES6 ES7什么的也有这个问题,也不知道解决了什么问题。

当然我经验少可能没遇到过它们要解决的问题。

而且我很讨厌的一点是很多前段框架都爱用Todo List来做例子和教程甚至还搞了个项目用所有前段框架来写Todo List。Todo List很有代表性吗?在我看来写Todo List就跟写Hello World一样,都是很流行然后并没由什么用的东西。 还有就是为什么Facebook和Ionic之类的公司这么坚持要把网页搬到iOS和Android上呢?Swift/iOS和Java/Android就这么难学么?我前段时间学了点iOS觉得挺简单的呀?至少比Redux简单。

和vuejs的性能对比呢?

#4楼 @nong 谢谢牢骚,认同你很多观点。

事情复杂到一定程度之前,各种轮子区别不会太大的,找自己趁手的就行了。

@nong 不知道为什么,基本不认同你所有观点 感觉写ruby的不用 coffeescript 就不会写 js 了

需要 登录 后方可回复, 如果你还没有账号请点击这里 注册