导图社区 前端主流框架对比
本导图介绍了前端中三大主流框架分别是React、Vue、Angular。对每个框架都进行了简介说明(如起源时间或现状)，然后介绍了框架的特性(用来区分每个框架)。对于每个框架的优点和缺点做了重点讲解，列出了原因和优缺点的具体表现形式，方便用户进行学习和理解。
社区模板帮助中心，点此进入>>
前端主流框架对比
基础知识
三大主流前端框架
React
前端开发人员构建复杂的web应用
用户群体最庞大
Angular
后端开发人员构建CURD(用户管理)类型应用
比较老牌的框架
Vue
前端开发人员快速构建web应用
新兴发展较快
起源
来自Facebook内部项目
用来架设Instagram的网站
开源时间
2013年5月
现状
React有较高的性能
代码逻辑简单
许多人关注并使用
特性
声明式设计
采用声明范式
描述应用较方便
高效
对DOM的模拟
极大地减少与DOM的交互
灵活
与已知的库(或框架)配合度高
优点
速度快
对实际DOM局部更新
在UI渲染过程中
通过在虚拟DOM中的微操作
跨浏览器兼容
解决了跨浏览器问题
提供了标准化的API(可在IE8中使用)
通过虚拟DOM
模块化
助你编写独立的模块化UI组件
当某些组件出现问题时
方便对组件进行隔离
单向数据流
Flux
用于JavaScript中
作用
创建单向数据层的架构
被Facebook概念化
随着React视图库的开发
纯javascript
背景知识
搜索引擎的爬虫程序
依赖服务端响应
不依赖JavaScript的执行
有助于搜索引擎优化
通过预渲染你的应用
兼容性好
用法
RequireJS
加载和打包
Browserify
Webpack
构建大型应用
好处
使艰难的任务容易完成
缺点
本身不是一个完整的框架
无法完成大型项目
解决办法
组成完整框架
通过添加
ReactRouter
具体作用
可构建大型应用
完成较大项目
简介
一款优秀的前端JS框架
已用于Google多款产品中
程序结构良好
双向数据绑定
指令
HTML模板
三"可"
可嵌入
可注入
可测试
模板丰富
自带极其丰富的angular指令
框架较为完善
包含功能
服务
模板
数据双向绑定
路由
过滤器
依赖注入
自定义指令
自定义指令可多次使用
引入了Java的一些东西
在ng模块化中
容易写出可复用代码
对敏捷开发的团队非常有帮助
有坚实的基础和社区支持
因为是谷歌开发
学习较难理解
入门很容易
但深入后概念很多
文档例子非常少
官方的文档基本只有api
问题解决
google
直接问misko(或angular)作者
对IE6/7兼容不算特别好
可用自写jQuery代码解决部分
容易写出四不像的代码
指令的应用的最佳实践教程少
解决方案
看一些作者的使用原则
如js中有jQuery的思想
有很多dom操作
DI依赖注入
代码压缩需要显示声明
尤雨溪编写
定义
其实不是框架
是构建数据驱动的Web界面的库
聚焦在V(view)视图层
轻量级
插件化
简单
官方文档很清晰
比Angular简单易学
快速
以异步批处理方式更新DOM
组合
组合应用程序
用可复用的组件
紧凑
~18kb min+gzip
无依赖
强大表达式
无需声明依赖的可推导属性(computed properties)
模块友好性
可通过NPM(或Bower或Duo)安装
使用场景灵活
不强迫所有代码都遵循Angular的规定
新生儿
是新项目
没angular成熟
影响度不是很大
没有体现多样性
丰富性少于其他一些有名的库
不支持IE8
