前端交流企鹅:724396871

近两年前端各框架流行程度与趋势分析

      

图1

上图显示了2016年10月至2017年10月的12个月期间,各个框架的绝对受欢迎程度及其增长情况。可以看出:

①  Vue 的成长速度非常快。

②  Angular的受欢迎程度基本保持不变。

③  jQuery仍然非常受欢迎,但用户使用量越来越少。

④   React 既庞大又在快速增长。

 

明显以上四个框架在开发中优势较大,所以,本次调研在Vue 、Angular 、React 和jQuery之间做比较。

 

 

Vue.js框架

特点:MVVM框架、数据驱动、组件化、轻量、简洁、高效、快速、模块友好等。

资源上:在以上所有框架中,Vue.js虽然是其中最为年轻的框架,但它已经拥有不少成熟的UI组件、开发框架和实用库、辅助工具等,在开发中可以配合Vue.js框架使用。以下为网络整理组件库总结链接地址:

https://www.cnblogs.com/jearay/p/8580958.html

值得一提的是Vue.js提供脚手架Vue-cli,本质是一套文件结构,包含基础的依赖库,能够帮助快速的开始一个Vue项目。

在兼容性方面:Vue.js不支持IE8及其以下版本,因为Vue.js使用了IE8不能模拟的es5特性。同时,Vue.js支持所有兼容es5的浏览器。具体版本如下图2。

图2 Vue2.0兼容情况

在调试与维护方面:对于Vue.js,调试有着专门的插件Vue-devtools,是一款基于chrome浏览器的插件,能够极大提高调试的效率。之前提到一个Vue的特点就是它是一个MVVM设计模式的框架,这样的模式会使代码维护起来更加方便。

Vue的缺点:生态与老牌框架仍是不足。编辑器对Vue的支持度也是不够,缺少代码提示。

适用场景:Vue的解决方案适用于小型应用,但对于对于大型应用而言不太适合。

附参考模板:https://www.cnblogs.com/herozhou/p/7434931.html

http://www.templatesy.com/Article/550.html

 

 

 

React.js框架

React是由Facebook开发并维护的一款JS库。

特点:声明式设计、虚拟DOM、JSX语法、组件化、单向响应数据流、轻等。

资源上:React框架是如今最火爆的前端技术框架。它有最吸引人的一点就是拥有众多的成熟的组件库,比如其中一些较为出名的React Material-UI、React-Bootstrap、Ant Design React等,以下有常见较成熟组件库的简单介绍和地址:

https://blog.csdn.net/snsHL9db69ccu1aIKl9r/article/details/79454984

在兼容性方面:V15版本以后正式告别IE8,可以通过es5-shim和es5-sham来兼容。

在调试与维护方面:Facebook为React提供了一个很给力的调试工具,React Developer Tools。可以自由安装在Chrome中或者FireFox中,上手基本没有难度。React的组件化特性使每个组件都拥有独立的功能视图模块,许多小的组件组成一个大的组件,整个页面也是由组件组合成的,非常利于重复利用和后期的维护。

React的缺点:React本身只是一个View层的一个框架而已,如果需要开发的型的应用,需要配合其他的库和框架。

适用场景React是组件化开发,非常适用于不是很复杂的移动端。

附参考模板:https://github.com/yezihaohao/react-admin

                    https://github.com/zuiidea/antd-admin

                    https://github.com/zhaoyu69/antd-spa

 

Angular.js框架

Angular是由Google负责维护的JS库。

特点:MVC模式、模块化、自动化双向数据绑定、依赖注入等。

在资源上:Angular目前由互联网巨头Google开发维护,在资源上是毋庸置疑的。社区基础是不用担心的,整个生态也已经是非常的完整,在开发中可以使用的组件、UI框架和库、服务性质的插件、用于测试与模拟数据的插件有许多。以下有Angular成熟好用的插件集合:

https://segmentfault.com/a/1190000003858219

在兼容性方面:AngularJS 1.2将继续支持IE8,但核心团队不会花时间去针对IE8或更早的IE浏览器问题作集成测试。如果确实需要在兼容IE8的同时使用1.3,就需要自己做全面测试。不过,这样做的话性价比比较低。所以,在工程实践中,一般以IE8为分界,如果需要兼容,就用1.2,否则就用之后的版本。在其他浏览器中,Angular的兼容是没有什么问题的。

调试与维护:关于Angular的调试,有专门用于浏览器的插件batarang。它可以查看作用域、输出调试信息、以及对性能进行监控。angular不像普通的js,如果抛出错误,只会报angularJs的错,找不到错误代码的位置,借助于batarang可以方便调试angular代码。
Angular的缺点:第一点,Angular框架过重,不像Vue和React是非常轻量级的框架,过大的框架导致性能方面消耗严重,这不是一个正常的前端网站能够容忍的,同时它的学习成本相对来说较高。第二点,Angular的文档编制非常糟糕,暴露的API中相当一部分是没有任何有用描述的方法和属性的简短存根。

适用场景它试用在大型的浏览器端,大型网站项目。

附参考模板:https://github.com/akveo/blur-admin

                      https://github.com/akveo/ngx-admin

                       http://www.mycodes.net/154/9043.htm

                       https://github.com/myopenresources/cc

 

 

jQuery框架

与其说jQuery是框架倒不如说它是一个JS库更合适。它是一个高效、精简并且功能丰富的 JavaScript 工具库。它提供的 API 易于使用且兼容众多浏览器,这让诸如 HTML 文档遍历和操作、事件处理、动画和 Ajax 操作更加简单。它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。

jQuery核心特性:轻量级、具有独特的链式语法和短小清晰的多功能接口、具有高效灵活的css选择器,并且可对CSS选择器进行扩展、拥有便捷的插件扩展机制和丰富的插件、jQuery兼容各种主流浏览器,如IE 6.0+、FF 1.5+、Safari 2.0+、Opera9.0+等。

在资源上:jQuery的易扩展性,吸引了来自全球开发者来编写jQuery的扩展插件。目前官方支持的插件已经有小几千种,民间插件就更多了。各种插件库、社区和工具网站也是非常多的。在所有的框架中jQuery在这一部分应该是最强的了。

兼容性:jQuery的1.x版本可以兼容到IE低版本(IE6、IE7、IE8),2.x及以上版本抛弃了对IE低版本的支持。

调试与维护:可以Chrome环境中安装jQuery Debugger插件。在Chrome默认的调试器中可以看到由插件生成的jQuery专用的调试栏。

jQuery的缺点:插件兼容性问题,jQuery不能向后见日兼容,这就导致了插件由于版本之间的不兼容出现的问题。再者在同一个项目中同时引入多个插件可能会引起插件之间的冲突,导致难以修复的BUG。

附参考模板:https://github.com/usmanhalalit/charisma

 

Logo

前往低代码交流专区

更多推荐