为什么要使用各种前端框架

引言

在学习前端的过程中,我开始接触到许多开发框架或开发工具,这些工具让我开始眼花缭乱。使用常规的html/css/js就已经能够开发出这种网页了,所以我问自己,为什么要学习这些框架或工具,这些库是用来解决什么问题的。想明白这个问题,我学习的目的就更加明确,在遇到一些开发情景时,也能够快速准确地挑选出应该使用的框架。

下面按照我目前的理解,对目前的主流的前端开发库进行一些分析和比较。由于我还是一个初学着,所以我的观点可能还不是很成熟。

为什么要使用jQuery

jQuery是一个轻量级js库,它有如下特性:

  • 简化了HTML/DOM操作
  • CSS选择器
  • 动画特效支持
  • 解决跨浏览器的兼容行问题
  • 完善的Ajax支持

在查阅资料的过程中,我还听到一些主张停用jQuery的声音。原因就在于随着前端开发生态不断的完善,现代浏览器原生API已经足够好用。

为什么要使用SASS

SASS是一种CSS预编译格式,它最终会编译成CSS。
SASS提供了CSS语法的拓展,它支持变量,算数运算符,循环操作,函数操作,样式模板(mixin)等强大的特性。它能够让开发人员更方便地编写CSS。SASS支持 import 关键字,这样就能够很方便地对样式进行模块化设计。

加一句题外话,在使用SASS时,需要考虑的另一个问题就是代码物理结构的安排(直白的说就是目录的划分,源文件的存放位置等),这也是所有代码开发中需要注意的问题。

与SASS相似的工具还有LESS。

为什么要使用Bootstrap

Bootstrap是一个用于快速开发网页的前端框架。以我目前的理解来看,它更像是一个网页样式框架。

  • 丰富的基础样式和资源
  • 响应式(responsive),良好的移动端支持
  • 强大的网格(grid)系统
  • 一致性,保证跨浏览器的样式一致

为什么要使用React

DOM操作对性能的影响很大,频繁的DOM操作会使网页渲染的速度变慢,React主要解决了这个问题。
React.js允许在js中编写html,形成Virtual DOM,只在变化进行重新渲染。

下面的一段文字摘自参考资料中的第5篇文章。

  • Am I building an app which has lots of DOM interactions, or is it a relatively simple app with relatively few interactions?
  • Does my app require a very high browser performance, that any user interactions must immediately be reflected in the UI? Is my data going to change over time, at a high rate?
  • Is one user interaction going to affect many other areas/components in the UI?
  • Is there a possibility that my app could grow big in the future, and so I would want to write extremely neat, modular front-end JavaScript that is easy to maintain? Would I want to use lots of native JavaScript or would I prefer using a lot of abstractions/methods provided in a framework?
  • Would I prefer a framework/library which does not have a high learning curve and which is pretty easy to get started with development?

在使用React之前,问自己这样几个问题,就能够帮助你决定是否需要使用React。

  • 所开发的网页应用涉及到很多DOM操作么?
  • 开发的网页应用需要很高的性能么,这意味着任何用于的操作都要立刻反应在界面上?我的数据变更会很频繁么?
  • 我开发的应用会在未来逐渐变得复杂么,这样我就需要将前端的js代码模块化?我是否会使用许多原生js特性,是否虚幻使用框架提供的抽象方法
  • 是否需要一个学习曲线比较平缓的框架,能够方便地上手进行开发?

Comments

Comments powered by Disqus