Mocha UI，Web 2.0时代的用户界面库

 

前些日子回顾了一下这几年做项目的一些技术框架。就用户界面技术而言，一些项目采用了 JQuery或 Prototype，个别项目根据用户要求使用了 Flex， YUI或 ExtJS，但多数项目没有用任何 Java Script框架。本来希望定一个范围，以便安排后续培训，结果各个项目组都有自己的喜好，很难达成一致。

支持 JQuery或 Prototype的主要理由是下载量小，对网页速度影响不大，而且和其他的 JS技术不冲突（这个对于维护发包来的维护项目很有用），学习起来也不难。

支持 Flex， YUI或 ExtJS的理由基本上是功能全面，成熟度较高。页面速度慢了一些，做起来也比较繁琐，但界面效果好，很合某些客户的胃口。

还有人对以上这些都不支持，说要研究一下 GWT（ Google Web Toolkit），据说可以用 Java写 Web界面，编译成 JS，这样就不用学 JS了。现在用 Struts或 JSF，偶尔需要某个效果到网上找一下，也过得去。等 HTML 5出来后，说不准就重新洗牌了。

会开到最后勉强决定把标准技术暂定为 JQuery。培训和使用负担不大，但至少可以结束使用山寨 JS了。这个结果对公司而言是必要的。尽管软件技术进步很快，但时刻要有手头的标准，这样才能避免浪费资源，提高团队的沟通和工作效率。然而对我自己而言，需要一个更好的答案。

事有凑巧，我正在做一个开源项目。本打算用 JQuery，可惜一直没找到合适的 UI套件（ Jquery UI似乎可以，不过不太成熟，我把几个布局组件套起来用，在 IE 8和 Firefox 3里尺寸和位置不一致，外观也不如 ExtJS漂亮）。于是我随手搜索“ better than jquery”，结果找到了 MooTools，之后找到了基于 MooTools的 Mocha UI。

MooTools压缩之后只有 20K多一点，功能堪比 JQuery，而且是面向对象的设计，给我的印象不错。缺点是：基本不能和其他 JS库共用。因为它把基本的 JS对象都给包装了，好处是提高了抽象级别，以及跨浏览器的通用性，坏处是别人的 JS代码不知道自己调用的已经不是原始的 JS对象了，可能有潜在问题。不过对我来说这不是问题，我的项目我说了算。

Mocha UI给我的第一印象不太好，在 IE 8里弹出窗口的上下边框不见了。后来下载了 SVN里的最新未打包代码，发现 IE 8也支持了，但属于临时解决方案，在例子中有针对 IE 8的 HACK代码，据说后续会整合到库文件中。

在之后的使用中，逐渐发现这个框架非常容易上手。通过修改例子，很快对框架的功能有了基本了解。例子程序的功能很全，绝大部分时候只要修改 HTML，对应 CSS里面特定的类，就可以把它变成另外一个应用程序界面。对于我等懒人，实在太好了。

我觉得界面的缺省效果和 ExtJS在伯仲之间，不过比 ExtJS快多了。当然了，你最好还是自己尝试一下（ http://mochaui.com/demo/），才知道味道如何。