还记得第一次用UI框架的时候吗?那时候你们用的什么呢?
那时候学习过Java,做一个电子购物商城,它的后台用的就是easyUI,那时候easyUI还没有现在的UI框架好用,用起来很繁琐,当然也没有现在的好看,但也不得不用。
后来再弄一个电影站点的时候,发现了LayUI,入门简单,使用起来更方便,后台界面的开发快速而又美观。直到现在适合于各种开发的UI框架相应而生,针对不同的界面开发选择相应的UI框架,能使开发效率事半功倍。
这篇文章就为大家介绍多种前端UI框架,助你高效开发。
LayUI
由职业前端倾情打造,面向全层次的前后端开发者,低门槛开箱即用的前端 UI 解决方案,layui是一个采用自身模块规范化编写的前端UI框架,它依照原生HTML/CSS/JS的书写与组织形式,入门简单,使用也非常简单。从核心代码到API的每一处细节都经过精心雕琢,非常适合界面的快速开发。
JEUI
它是一款国产前端UI框架,遵循原生HTML/CSS/JS的书写与组织形式,国内很多程序员javascript不熟, 大大影响了开发速度. 因此JEUI不需要开发人员去关心javascript怎么写, 只要写标准html就可以了,门槛极低,拿来即用。其外在极简,却又不失饱满的内在,体积轻盈,组件丰盈,从核心代码到API的每一处细节都经过精心雕琢,非常适合界面的快速开发。
JEUI基于jQuery的UI框架,包括表单、布局、表格等等常用UI控件,使用JEUI可以快速轻松地创建风格统一的界面效果。
浏览器兼容非常牛皮,能兼容IE8以上的浏览器。
DWZ
DWZ富客户端框架(jQuery RIA framework), 是中国人自己开发的基于jQuery实现的Ajax RIA开源框架. 设计目标是简单实用,快速开发,降低ajax开发成本。
DWZ 支持用 html 扩展的方式来代替 javascript 代码, 基本可以保证程序员不董 javascript, 也能使用各种页面组件和 ajax 技术. 如果有特定需求也可以扩展 DWZ 做定制化开化.
MDUI
MDUI 是一个基于 Material Design 的前端框架。
19 种主色、16 种强调色、1 种夜间主题,只需添加一个 CSS 类即可切换。CSS 仅 26.7KB,JavaScript 仅 14KB,加载更迅速。移动优先,从小屏逐步扩展到大屏,最终实现所有屏幕适配。不依赖任何第三方库,节约网络流量,使加载更迅速,提高用户体验。使用 CSS3 来做动画交互,平滑、高效,让 Web 应用的动画更流畅。提供自定义打包功能,按需打包需要的主题和组件,使文件体积骤然减小。MDUI 包含了 20 余个组件,且每个组件都可以适应不同主题。
只需懂一点 HTML、CSS、JS 的基础知识,就能使用 MDUI。
ElementUI
element ui框架的按钮组件,这款由饿了么前端开源的UI框架,一经面世,就收获大量程序员的芳心,在github 上更是高达29.8k的star早已说明一切,用于开发PC端的页面还是绰绰有余的,如果说你是用vue开发者,却没用过element UI,那你肯定不是合格的vue开发者。
WeUI
jQuery WeUI 是专为微信公众账号开发而设计的一个简洁而强大的UI库,包含全部WeUI官方的CSS组件,并且额外提供了大量的拓展组件,丰富的组件库可以极大减少前端开发时间。
jQuery WeUI 的最大特点是它只提供UI组件,并不会对项目所使用的框架和其他库有任何的限制,几乎可以在任何环境下使用。无论你的项目是基于jQuery,还是 React, Angular, Vue, 你都会发现 jQuery WeUI 能非常方便的和他们结合使用。既是你的项目是一个有很悠久历史的老项目,也几乎可以做到拿来即用。
Flutter
Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面,前端对于 Flutter 的热忱度之高一度让人有点惊讶,事实上在 Flutter 社区内见到的客户端开发者远多于前端开发,不过前端对于跨端解决方案确实有着天然的渴求。
Flutter可以与现有的代码一起工作。在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。
iView ui
iViewui一套基于 Vue.js 的高质量 UI 组件库,搭配使用 iView UI 组件库形成的一套后台集成解决方案,由 TalkingData 前端可视化团队部分成员开发维护。iView Admin 遵守 iView 设计和开发约定,风格统一。
Mint UI
Mint UI 包含丰富的 CSS 和 JS 组件,能够满足日常的移动端开发需要。通过它,可以快速构建出风格统一的页面,提升开发效率。
真正意义上的按需加载组件。可以只加载声明过的组件及其样式文件,无需再纠结文件体积过大。
考虑到移动端的性能门槛,Mint UI 采用 CSS3 处理各种动效,避免浏览器进行不必要的重绘和重排,从而使用户获得流畅顺滑的体验。
依托 Vue.js 高效的组件化方案,Mint UI 做到了轻量化。即使全部引入,压缩后的文件体积也仅有 ~30kb (JS + CSS) gzip。
YDUI Touch
YDUI Touch 专为移动端打造,在技术实现、交互设计上兼容主流移动设备,保证代码轻、性能高。
使用 Flex 技术,灵活自如地对齐、收缩、扩展元素,轻松搞定移动页面布局。
实现强大的屏幕适配布局,等比例适配所有屏幕。什么?用得不开心?轻松切换 px。
自定义Javascript组件、Less文件、Less变量,定制一份属于自己的YDUI。
SUI Mobile
SUI Mobile 是一套基于 Framework7 开发的UI库。它非常轻量、精美,只需要引入我们的CDN文件就可以使用,并且能兼容到 iOS 6.0+ 和 Android 4.0+,非常适合开发跨平台Web App。轻量的UI库
SUI Mobile 非常轻量,核心库压缩Gzip后的JS、CSS网络传输体积总共只有52K,却提供了20+个常用的组件。
Amaze ~ 妹子 UI
中国首个开源 HTML5 跨屏前端框架
Amaze UI 以移动优先(Mobile first)为理念,从小屏逐步扩展到大屏,最终实现所有屏幕适配,适应移动互联潮流。
Amaze UI 含近 20 个 CSS 组件、20 余 JS 组件,更有多个包含不同主题的 Web 组件,可快速构建界面出色、体验优秀的跨屏页面,大幅提升开发效率。
相比国外框架,Amaze UI 关注中文排版,根据用户代理调整字体,实现更好的中文排版效果;兼顾国内主流浏览器及 App 内置浏览器兼容支持。
Amaze UI 面向 HTML5 开发,使用 CSS3 来做动画交互,平滑、高效,更适合移动设备,让 Web 应用更快速载入。
cube-ui
质量可靠:由滴滴内部组件库精简提炼而来,历经考验,并且每个组件都有充分单元测试,为后续集成提供保障。
体验极致:以迅速响应、动画流畅、接近原生为目标,在交互体验方面追求极致。
标准规范:遵循统一的设计交互标准,高度还原设计效果;接口标准化,统一规范使用方式,开发更加简单高效。
扩展性强:支持按需引入和后编译,轻量灵活;扩展性强,可以方便地基于现有组件实现二次开发。