常用的前端框架优缺点总结

JQuery

---

JQuery是一个优秀的javascript框架
JQuery宗旨是Write Less Do More
JQuery是轻量级的js库

特点

• 轻量级的Javascript框架
• 丰富的DOM选择器
• 链式表达式
• 支持事件、样式、动画
• 支持Ajax操作
• 跨浏览器兼容
• 插件扩展开发（丰富的第三方插件）
• 可扩展性强（提供扩展接口）

优点

• 实现脚本与页面分离
• 最少的代码做最多的事情
• 性能支持比较好

缺点

• 插件冲突
• 不能向后兼容

Zepto.js

---

针对移动端浏览器

• 轻量级的JavaScript库
• 兼容JQuery的API
• 增加了移动设备的触摸等事件
• 不支持IE浏览器

Bootstrap

---

用于开发响应式布局、移动设备优先的web项目

特点

• 预处理脚本
• 一个框架、多种设备
• 特性齐全

优点

• 比较成熟
• 拥有完善的文档
• 有大量的组件样式

缺点

• 有需求要重新定义样式
• 会有兼容问题

Vue.js

---

是一套用于构建用户界面的渐进式框架

特性

• 轻量级的框架
• 双向数据绑定
• 指令
• 插件化

优点

• 简单易用
• 灵活渐进式
• 轻量高效
• MVVM
• 组件化

缺点

• 不支持IE8
• 生态环境不如angular和react

组件化优点

• 提高开发效率
• 方便重复使用
• 简化调试步骤
• 提升整个项目的可维护性
• 便于协同开发

React

---

优点

• 速度很快（不直接对DOM进行操作）
• 跨浏览器兼容（虚拟DOM）
• 一切都是component：(代码更加模块化，重用代码更容易，可维护性高) 单向数据流（Flux是一个用于在JavaScript应用中创建单向数据层的架构，它随着React视图库的开发而被Facebook概念化）
• 同构、纯粹的JavaScript（有助于搜索引擎优化）
• 兼容性好

缺点

• 不适合单独做一个完整的框架

AngularJs

---

通过指令扩展了HTML，通过表达式绑定数据到HTML

优点

• 双向数据绑定
• 代码模块化（每个模块的代码独立拥有自己的作用域，model，controller等）
• 强大的directive可以将很多功能封装成HTML的tag，属性或者注释等（大大美化了HTML的结构，增强了可阅读性）
• 依赖注入（提高重用性和灵活性）

缺点

• 验证功能错误信息显示比较薄弱，需要写很多模板标签
• 升级后可能会导致一个兼容性的BUG
• ng提倡在控制器里面不要有操作DOM的代码，对于一些jQuery插件的使用，如果想不破坏代码的整洁性，需要写一些directive去封装插件，现在有很多插件的版本已经支持Angular了
• 比较笨重，没有轻量级的版本

原文链接：常用的前端框架优缺点总结