性能、UX、跨平台：移动Web应用UI框架大比拼

当我首次使用Ionic时，我实在不敢相信短短3分钟就能诞生一个可运行的应用。Ionic不但能节省构建应用架构的时间，还能帮助改进不尽如人意的架构，并替换之前的CSS文件（SASS）。此外，Ionic一整套丰富的工具，从“下拉刷新（Pull-To-Refresh）”到“无限滚动（Infinite Scroll）”应有尽有，能极大地节省开发者的时间。

• Ionic的优劣势对比：

优势	劣势
完美融合AngularJS	测试阶段，有Bug
全套UI组件（下拉刷新、无限加载、标签等）	变换&动画效果不够流畅
社区活跃、框架适用范围广

• 评分：

评分标准	得分
文档	8.0
快速入门	10.0
性能	5.0
社区	7.0
学习曲线	7.0

2. Famo.us + AngularJS

以最炫HTML5 JavaScript框架著称的Famo.us可以说是专为提高应用性能而生，而此处中所讲的并非单纯的Famo.us框架，而是ThomasStreet开发的Famo.us&Angular整合版。用自主开发的JavaScript引擎结合CSS3 3D转换基础上的GPU加速，来打造60帧/秒（fps）的流畅动画效果，满足最佳用户体验的需求，绝对能让你的混合应用一瞬间高大上起来。

在渲染DOM元素方面，Famo.us的方法也独树一帜： 干脆放弃DOM，转而创建自己的DOM渲染树。效果很不错，值得称赞。

由于Famo.us和Ionic的侧重点有所不同，目前还不足以构成竞争的关系。不过考虑到两个框架都整合了AngularJS，而前者弥补了Ionic恼人的性能和动画流畅度的问题，由此来看，未来Famo.us很可能对Ionic构成威胁。前不久，Ionic团队曾在论坛表示会考虑整合Ionic和Famo.us，但问题是后者的UI完全遵循不同的运作方式。

而Famo.us虽然在性能上有着卓越的优势，却也缺失了很多开发所必要的工具，换句话说，Famo.us只是一堆文件和文件夹组合起来的架构而已，顺带几个Angular和Famo.us运行的范例罢了。我也是花了很长的时间才搞清楚用“原生”Famo.us和AngularJS&Famo.us开发应用的区别。

要启动一个Famo.us+ AngularJS项目，只需复制一下初学者工具包或使用Bower管理工具来安装即可。

节点依赖模块（Node Dependencies）：

启动项目：

通过上面的步骤，在端口9000创建一个NodeJS服务器，随后便可编写Famo.us。打开浏览器，即可看到一个完整的Angular整合Famo.us的范例。

Famo.us包含了两个主要的“DOM”元素，分别为modifiers和surface。surface从根本上讲就是内容，也就是HTML元素，而modifier则是执行动画、移动或其他操作的对象，两者相辅相成。

• Famo.us+ AngularJS的优劣势对比：

优势	劣势
60 fps的动画效果让应用更加生动，拥有着更好的用户体验	不提供菜单、标签、基本应用结构/布局等基础架构
整合AngularJS	发展尚未成熟，可供参考的范例有限
提供初学者工具包	文档中缺少“入门指南”

• 评分：

评分标准	得分
文档	6.0
快速入门	4.0
性能	10.0
社区	4.0
学习曲线	4.0

最初使用Famo.us时并不觉得惊艳，直到后来在移动设备上测试，看到最终效果时才暗自叫绝。Famo.us的性能和灵活性非常棒，但呈现的学习曲线比较陡峭，而且文档也不够详尽和易懂。在框架使用过程中，很多时候都像是摸着石头过河，而具体的范例能帮助开发者更快掌握使用方法。

但即使Famo.us存在众多缺点，但打造复杂动画效果的优势让人难以拒绝。开发者应密切关注Famo.us的发展动向，这个框架成长得很快，也在日臻完善。