IT序号网

UI优秀框架(库)知识解答

flyfish 2021年05月25日 编程语言 228 0

1.vux

官网:IT虾米网

Github:IT虾米网

13818  Stars  3064 Forks

 

VUX(读音 [v’ju:z],同 views)是基于WeUIVue(2.x)开发的移动端UI组件库,主要服务于微信页面。

基于webpack + vue-loader + vux可以快速开发移动端页面,配合vux-loader方便你在WeUI的基础上定制需要的样式。

vux-loader保证了组件按需使用,因此不用担心最终打包了整个vux的组件库代码。

VUX并不完全依赖于WeUIVUX 在 WeUI 的基础上扩展了多个常用组件,但是尽量保持整体UI样式接近WeUI的设计规范。

总结:vux还是比较适合当前小程序开发的,组件非常全面,而且使用说明也都非常详细,并且可以直接查看源码,学习起来也比较方便。

 

2.Amaze UI

官网:IT虾米网

Github:IT虾米网

12179  Stars  2496 Forks

  • Amaze UI 以移动优先(Mobile first)为理念,从小屏逐步扩展到大屏,最终实现所有屏幕适配,适应移动互联潮流。
  • Amaze UI 含近 20 个 CSS 组件、20 余 JS 组件,更有多个包含不同主题的 Web 组件,可快速构建界面出色、体验优秀的跨屏页面,大幅提升开发效率。
  • 相比国外框架,Amaze UI 关注中文排版,根据用户代理调整字体,实现更好的中文排版效果;兼顾国内主流浏览器及 App 内置浏览器兼容支持。
  • Amaze UI 面向 HTML5 开发,使用 CSS3 来做动画交互,平滑、高效,更适合移动设备,让 Web 应用更快速载入。

总结:组件种类较为丰富,Amaze UI Web和element-UI较为相似。Amaze UI Touch风格比较赏心悦目,适合React开发的项目。

3.WeUIi

Github:IT虾米网

DEMO:IT虾米网

19854 Stars  5278 Forks

WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一。

风格更加偏向于原生微信。

4.MUI

官网:IT虾米网

Github:IT虾米网

9751 Stars  5137 Forks

官网描述:最接近原生APP体验的高性能前端框架。

总结:这个框架是以两大系统为参照来封装UI组件,框架自身还有一个较为活跃的社区,不太好的地方是关于开发应用的流畅度,这页是 H5 

目前的劣势,MUI其实还是需要是借助 Webview来提升,而不是框架本身。

5.Semantic UI

官网:IT虾米网

Github:IT虾米网

42627 Stars  4584 Forks

Semantic作为一款开发框架,帮助开发者使用对人类友好的HTML语言构建优雅的响应式布局。

总结:跟 Bootstrap 没太多的区别,不过代码命名规范上却相差甚大,Semantic的命名全是采用复合的方式,类名特别的离散,用的时候需要小心自己扩展或者新增的 class 命名与它的类名冲突。

风格中规中矩,比较适合传统行业及B端系统开发

6.UiKit

官网:IT虾米网
Github:IT虾米网

13006 Stars  1976 Forks

样式中规中矩,组件效果js实现比较清楚,可以学习借鉴。

7.Pure

官网:IT虾米网

Github:IT虾米网

18965 Stars  2028 Forks

和bootstrap比较类似,样式风格较为单一。

8.Ant Design

官网:IT虾米网

Github:IT虾米网

32705 Stars  10511 Forks

特性#

  • 提炼自企业级中后台产品的交互语言和视觉风格。

  • 开箱即用的高质量 React 组件。

  • 使用 TypeScript 构建,提供完整的类型定义文件。

  • 全链路开发和设计工具体系。

支持环境#

  • 现代浏览器和 IE9 及以上(需要 polyfills)。

  • 支持服务端渲染。

  • Electron

和Element-ui比较相似,样式风格比较适合PC端系统。


发布评论
IT序号网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!

CSS Grid布局指南知识解答
你是第一个吃螃蟹的人
发表评论

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。