孔子说:"工欲善其事,必先利其器",学习WEB前端开发也是一样。在开发过程中,经常我们会遇到很多繁杂精细的麻烦问题,虽然知道要去按照步骤解决,但总归耗费大量的时间。 再加上最近很多小伙伴问小渡:有没有好用的前端开发工具推荐呢?小渡今天就特地整理了一批好用的web前端开发框架和他们的特点,帮助大家根据不同的需求,不同的业务场景,做出最合适的选择,让开发变得高效,快速。 有了这些工具在手,就可以从繁重的工作任务中解脱出来,有大把的时间去王者峡谷散步打野浪一圈了。 前方干货来袭!还不准备好小板凳认真做笔记~ 1、Alertify.js 网站:http://alertifyjs.com/ AlertifyJS是一个用于开发浏览器对话框和通知的JavaScript框架,它不仅提供了默认浏览器对话框的替代,更使得创建自己的界面变得非常简单。 2-AngularJS1.X 网站:angularjs.org angularjs是一个javascript框架。通过script脚本引入,是一个用Javascript编写的库。angularjs通过指令扩展了HTML,通过表达式绑定数据到HTML中。 AngularJS主要考虑的是构建CRUD(增删改查)应用。幸运的是,至少90%的WEB应用都是CRUD应用。 优点: 1、一些大公司正在使用的流行框架 2、开发现代Web应用程序的解决方案 3、是标准MEAN栈(MongoDB,Express.JS,AngularJS,NodeJS)的一部分,有许多文章和教程可用 缺点: 1、学习曲线陡峭 2、大的代码库 3、无法升级到Angular2.x 3-Angular4.X 网站:angular.io 其实关于为什么从2直接跳跃到了4,其实很简单,原因是,Angular2这个framework有点大,core分了好几个libraries,都分别属于不同的npmpackage。 所有的libraries本来都乖乖的按照一个方式命名,非得有个人要起幺蛾子,就是那个叫angular/router的货,人家都是2.3.0,这个幺蛾子非得叫3.3.0。 Angular团队本来计划好的Angular3 就会有一系列的3.x.x加上一个4.x.x。估计是为了照顾router的情绪吧,决定全体改成4得了。并没有什么隐形关卡哦。 优点: 1、开发现代Web应用程序的解决方案; 2、是标准MEAN栈的一部分,尽管只有少量的教程可用; 3、对于熟悉静态类型语言(如C#和Java)的开发人员,TypeScript提供了一些优势。 缺点: 1、学习曲线陡峭; 2、大的代码库; 3、不能从Angular1.x升级; 4、与1.x相比,Angular2.x较难理解。 4-REACT 网站:facebook.github.io/react/ React是一个用于创建用户界面的开源JavaScript库,旨在解决开发单页应用程序时遇到的挑战。 优点: 1、小巧,高效,快捷灵活; 2、简单的组件模型; 3、良好的文档和在线资源; 4、可实现服务器端渲染; 5、目前受欢迎,经历了快速增长。 缺点: 1、需要学习新的概念和语法; 2、构建工具很重要; 3、需要其它类库或框架提供model和Controller部分; 4、与修改DOM的代码和其它类库不兼容。 5-Vue.js 网站:vuejs.org 通常,大家不信任年轻的程序员是因为他们缺乏经验。然而,很多新技术却吸引了大量的程序员,因为它们弥补了以前工具的缺点。这就是Vue.js成功的地方。 程序员让Vue.js尽可能简单,并让接近88%的用户对其感到满意。Vue用于阿里巴巴、百度和WizzAir等。 优点: 1、可以快速使用,并且日益普及; 2、很容易提高高水平开发人员的满意度; 3、依赖性小,性能好。 缺点: 1、一个较新的项目– 风险可能会更大; 2、部分依赖开发人员进行更新; 3、相比于其它框架,资源较少; 6-Backbone.js 网站:backbonejs.org backbone作为一个老牌js框架为大规模前端开发提供了新的开发思路:前端MVC模式。 这个模式也是前端开发演变过程中的一个重要里程碑,也为MVVM和Redux等开发思路奠定了基础,后来的react,vue无不是在backbone的影响下开创出来的经典模式。 优点: 1、体积小,重量轻,复杂度低; 2、不添加HTML逻辑; 3、文件丰富; 4、采用了许多应用,包括Trello、WordPress.com、LinkedIn和Groupon。 缺点: 1、与AngularJS等其它框架相比,抽象度较低; 2、需要额外的组件来实现数据绑定等功能; 3、最新的框架已经不采用MVC架构了。 7-Ember.js 网站:emberjs.com 这是一个用于创建web应用的JavaScript MVC框架,采用基于字符串的Handlebars模板,支持双向绑定、观察者模式、计算属性(依赖其他属性动态变化)、自动更新模板、路由控制、状态机等。 优点: 1、为客户端应用程序提供了单一解决方案; 2、开发人员可以立刻提高开发效率– 它使用jQuery; 3、良好的向后兼容性和升级选项; 4、采用了现代Web开发标准。 缺点: 1、大型分配式; 2、与其它正在向较小组件结构发展的框架相比,它十分的庞大。 8-Knockout.js 网站:knockoutjs.com Knockout.js是一个基于MVVM模式的轻量级的前端框架,能够友好地处理数据模型和界面DOM的绑定。 最重要的是,它的绑定是双向的,也就是说数据模型变化了,界面DOM上的数据也会跟着发生变化,反过来,界面DOM上的数据变化了,数据模型也会相应这个变化。 这样能够大大减少我们的前端代码量,并且使得我们界面易于维护,再也不用写一大堆事件监控数据模型和界面DOM的变化了。 优点: 1、小而轻便,无依赖; 2、优秀的浏览器支持; 3、良好的文档资源。 缺点: 1、较大的项目可能变得很复杂; 2、发展已经放缓; 3、使用情况似乎在减弱。 9-Aurelia 网站:https://aurelia.io/ 一种相对较新的,轻量级的跨平台框架,下一代 JavaScript 客户端框架,利用简单的约定来激发你的创造力。 凭借其强大的专注于开发经验, Aurelia 可以使您不仅创造惊人的应用程序,同时也享受这个过程。它经过精心设计,是可插拔和可定制的。 优点: 1、双向绑定,可扩展的html,Web Component等; 2、嵌套路由。 缺点: 1、UI等组件太少; 2、不提供数据层。 10-Keras.js 网站: https://transcranial.github.io/keras-js/ Keras.js是另外一个热门的开源框架,它使你能够在浏览器中运行机器学习模型,使用WebGL来提供GPU模式的支持。 优点: 1、API简单,易用。 2、文档齐全,并且文档内容组织地很好。 3、扩展性好。后端支持Tensorflow, theano,mxnet,cntk. 而且自定义层也比较好写。 4、使用人群分布很广。 缺点: 1、速度慢。后端如果使用mxnet或cntk,速度会快些;如果使用Tensorflow或theano,速度很慢。 2、程序占用GPU内存比较多。 ////////// 目前最为流程的框架是React,同时其它的框架也在向着流行的趋势发展。如果需要一个安全的、通用的Web应用程序,可以考虑使用Vue.js。 当然,web框架工具还有很多,也许小渡无法告诉你哪个是最好的,但是最适合自己的、项目的,就是最好的。多用多学多练习,才更适合你们哦!