IT博客汇 | 移动webapp前端ui用哪个框架比较适合小项目？

移动webapp前端ui用哪个框架比较适合小项目？

woyoo发表于 2016-03-07 07:33:36

最近有个项目要在手机上查看报表和做一些操作，网上筛选了些移动端前端ui框架，这里收集下。

你可以对比下WeUI, FrozenUI, sui mobile, gmu, jingle, purecss, ionic, jquerymobile,bootstrap。小项目我觉得用用bootstrap，jquerymobile就足够了。由于对这块不是很熟，不敢评论，就列了下链接。

腾讯系的开源ui

WeUI

WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信 Web 开发量身设计，可以令用户的使用感知更加统一。包含button、cell、dialog、 progress, toast、article、icon等各式元素。

预览地址：http://weui.github.io/weui/

GitHub 下载地址：https://github.com/weui/weui

Frozen UI

Frozen UI是腾讯社交用户体验设计－增值UI开发团队一个开源的简单易用，轻量快捷的移动端UI框架。基于手Q样式规范，选取最常用的组件，

做成手Q公用离线包减少请求，升级方式友好，文档完善，目前全面应用在腾讯手Q增值业务中。

FrozenUI提供的CSS组件是目前QQ会员前端开发组所用的通用样式库。遵循手Q样式规范，基本样式使用离线包的方式减少请求，并提供快速接入的方案。
FrozenUI提供的一系列JavaScript插件，更优雅地在移动端上呈现更灵动的动画效果。
FrozenJS 是针对移动端开发的 js 组件库，其依赖 zepto.js 和 FronzenUI。
FrozenJS 的所有组件均以 zepto 的插件的形式存在。

预览地址：http://frozenui.github.io/frozenui/demo/index.html

GitHub 下载地址:https://github.com/frozenui/frozenui

阿里开源的SUI Mobile

SUI Mobile

主页：http://m.sui.taobao.org/

SUI Mobile 是一套基于 Framework7 开发的UI库。并参考 Ratchet、Fastclick 开源库。它非常轻量、精美，只需要引入我们的CDN文件就可以使用，并且能兼容到 iOS 6.0+ 和 Android 4.0+，非常适合开发跨平台Web App。

轻量的UI库 SUI Mobile 非常轻量，核心库压缩Gzip后的JS、CSS网络传输体积总共只有52K，却提供了20+个常用的组件。

对于只有HTML&CSS的组件，你只需要复制HTML代码既可以使用。他的大部分JS组件都是独立的 Zepto 插件，并且提供了Zepto/jQuery 风格的API，你将会非常熟悉这种方式。

开发团队：阿里巴巴共享业务事业部UED团队

Github：https://github.com/sdc-alibaba/SUI-Mobile

Demo：http://m.sui.taobao.org/demos/

百度系

GMU

GMU是基于zepto的mobile UI组件库，提供webapp、pad端简单易用的UI组件!

官方地址：http://gmu.baidu.com/

Jingle

Jingle是一个SPA(Single Page Application)开发框架，用来开发移动端的html5应用，在体验上尽量去靠近native应用，希望有一天html5能够做到与native一样的操作体验。

丰富的UI组件提供了按钮、列表、表单、弹出框、轮换、上拉/下拉、日历等各种移动端常用的组件，简单适用，

前后端分离支持前端模板渲染，模板按需自动加载，完善的事件机制。

轻量级基于Zepto开发，依赖了iscrol

官方地址http://vycool.com/Jingle/

演示：http://vycool.com/Jingle/samples.html

purecss

purecss采用其Grid的部分即可，需要定制的部分，建议自行配置，或者是直接采用grid.css，grid960.css这样的栅格来处理。Purecss小的没有节操，全部模块gzip压缩后才 4.4KB* 。考虑到移动端，保持文件尽量小对我们来说非常重要，每一行CSS都经过深思。如果你只用部分模块，简直小的忽略。

Pure基石,Pure基于Normalize.css添加了HTML元素的布局和样式，以及常用的UI组件。全是精华，木有糟粕。

移动端是初衷,Pure是响应式的盒子模型，适应所有尺寸的屏幕。通过皮肤生成器可以自定义样式。

写出你自己的样式,Pure提供最基础的样式，鼓励你基于此写出自己的样式。它被设计为容易覆写，且不影响你自己的样式。