JS框架,我认为大体上可以分为两种。一种是类似jQuery/ d3那样的,通过修改html的DOM结构来渲染UI的库。

还有一种则是类似于AngularJS/ReactJS 那样的,采用MVC分层的,通过Model来渲染View UI框架。

注意这里的区别,jQuery类似于库,而Angular类似于框架,这也意味着使用Angular要严格按照框架规定来写。但Vue虽然也是MVC渲染,但更像一个库,所以明显要比Angular上手要容易。

jQuery从后台返回的数据要渲染到前端上需要通过手动更新DOM,性能比较好。但开发效率和代码规范不如NG/ReactJS,但是手动改DOM一般比MVC渲染的性能好。目前来说基于jQuery的前端组件库最多,而Angular/React的还比较少。

下面列举几个比较知名的前端UI库

Bootstrap

这个基本上就不用说明了,一个前端CSS框架,基于jQuery,但是很多复杂的控件没有,像 datagrid/ dialog/ tree/ charts之类的,不过基于bootstrap的组件库也比较多,可以自己去找找。

Foundation

类似Bootstrap
https://foundation.zurb.com/

Semantic UI

前端框架,不过组件也比较少
https://github.com/Semantic-Org/Semantic-UI

Kendo UI

kendoui.com 传统的各种datagrid/charts/dialog库,分开源和商业两种版本,使用比较复杂的控件要购买商业版。

Materialize

另一个前端响应式Web框架
https://github.com/Dogfalo/materialize

jQuery Mobile

http://demos.jquerymobile.com/1.4.5/slider/jQuery Mobile一些组件库(而非jquery的移动版本)。jQuery Mobile是一款基于HTML5的用户界面系统,

Sencha Touch

以前叫Ext,注意它不是基于jQuery的,是基于另外一种元素选择器构建起来的前端组件库。

另外还有一些 Amazeui/ jQuery EasyUI/ materialize/ weex 之类的,有兴趣也可以研究一下。


扫描二维码,在手机上阅读!