提高开发效率的发展历程:
原生JS(存在兼容性问题,开发效率低) -> Jquery之类的类库(轻量级脚本语言、css兼容性、跨浏览器,但是还是有频繁操作DOM元素的缺点) -> 前端模板引擎(出现重绘和重排的问题) -> Angular.js / Vue.js(能够帮助我们减少不必要的DOM操作;提高渲染效率;双向数据绑定的概念【通过框架提供的指令,只需要关心数据的业务逻辑,不再关心DOM是如何渲染的了】)
框架和库的区别:
框架:是一套完整的解决方案;对项目的侵入性较大,项目如果需要更换框架,则需要重新架构整个项目。
库(插件):提供某一个小功能,对项目的侵入性较小,如果某个库无法完成某些需求,可以很容易切换到其它库实现需求。
Node(后端)中的 MVC 与 前端中的 MVVM 之间的区别:
<!-- 将来 new 的Vue实例,会控制这个 元素中的所有内容 -->
<!-- Vue 实例所控制的这个元素区域,就是我们的 V -->
<div id="app">
<p>{{ msg }}</p>
</div>
<script>
// 2. 创建一个Vue的实例
// 当我们导入包之后,在浏览器的内存中,就多了一个 Vue 构造函数
// 注意:我们 new 出来的这个 vm 对象,就是我们 MVVM中的 VM调度者
var vm = new Vue({
el: '#app', // 表示,当前我们 new 的这个 Vue 实例,要控制页面上的哪个区域
// 这里的 data 就是 MVVM中的 M,专门用来保存 每个页面的数据的
data: { // data 属性中,存放的是 el 中要用到的数据
msg: 'Vue' // 通过 Vue 提供的指令,很方便的就能把数据渲染到页面上,
// 程序员不再手动操作DOM元素了【前端的Vue之类的框架,
// 不提倡我们去手动操作DOM元素了】
}
})
</script>