加载中...

Hello world! (初来博客园的测试)

Hello world!

第1章 Vue.js基础指令


1.vue.js官网

https://cn.vuejs.org/
https://vuejs.bootcss.com/v2/guide/

2.vue.js与js区别

​ JS(由ECMAScript、DOM和BOM三部分组成)和JQ的核心是DOM操作,编程范式是命令式的,而Vue.js的核心是数据驱动,编程范式是声明式的。
​ 在Vue中要尽量减少DOM操作。

补充

在项目开发要尽量减少for循环的使用,因为for循环的性能比较差!

3.vue2.0 到 vue3.0

3.1 Vue3带来的变化(源码)

  • 源码通过monorepo的形式来管理源代码:

    • Mono:单个
    • Repo:repository仓库
    • 主要是将许多项目的代码存储在同一个repository中;
    • 这样做的目的是多个包本身相互独立,可以有自己的功能逻辑、单元测试等,同时又在同一个仓库下方便管理;
    • 而且模块划分的更加清晰,可维护性、可扩展性更强;
  • 源码使用TypeScript来进行重写:

    • 在Vue2.x的时候,Vue使用Flow来进行类型检测;
    • 在Vue3.x的时候,Vue的源码全部使用TypeScript来进行重构,并且Vue本身对TypeScript支持也更好了

3.2 Vue3带来的变化(性能)

  • 使用Proxy进行数据劫持

    • 在Vue2.x的时候,Vue2是使用Object.defineProperty来劫持数据的getter和setter方法的;
    • 这种方式一致存在一个缺陷就是当给对象添加或者删除属性时,是无法劫持和监听的;
    • 所以在Vue2.x的时候,不得不提供一些特殊的API,比如$set或$delete,事实上都是一些hack方法,也增加了 开发者学习新的API的成本;
    • 而在Vue3.x开始,Vue使用Proxy来实现数据的劫持,这个API的用法和相关的原理我也会在后续讲到;
  • 删除了一些不必要的API:

  • 移除了实例上的$on, $off 和 $once; p移除了一些特性:如filter、内联模板等;

  • 包括编译方面的优化: p生成Block Tree、Slot编译优化、diff算法优化;
    .................(不完整)

posted @ 2021-11-20 16:35  佩弦的小风  阅读(53)  评论(0编辑  收藏  举报