Vue3.0改变,新功能----尤雨溪分享会

尤雨溪讲解vue3.0新特性学习笔记

  • 1.3.0新特性一览:

  • a.以es5为基础,更小更快

  • b.支持TS,3.0的源码使用TS编写

  • c.提高自己的可维护性

    更小:tree-shaking
    

实现类似babel一样的能力,vue从之前的10KB变为2~3KB,即不用打包不到的功能

	更快:Proxy重构vitulal DOM功能,

利用proxy与Object.defineProperty()这个api类似的功能做数据的监听和双向绑定,
尤大的原话是’‘Proxy的结构更加成熟,而由于JS引擎本身决定,对象结构越稳定,性能越好’’,
Proxy更好的依赖追踪,甚至是以前做不到的数组的追踪
Proxy的弊端在于不支持ie11以下的浏览器*备注1

	`3.0 vitual DOM的性能瓶颈的突破和优化实------动静结合

2.0下的虚拟DOM有个性能的问题,内存性能与模板的大小正相关,而与节点数量无关,这是由于1个动态节点和100个动态节点一样都是都是在模板中依靠同样的遍历所得到的,这就是遍历的所有节点的弊端

尤大的思路是"把所有的动态节点拉成一个Block,更新时候只要遍历动态节点,不遍历所有节点"

性能提高至少1倍,如果是模板越大,动态节点越少,性能越高,原则上来说无上限提高

TS源码

使得后期更好的维护,而且不会无TS不影响.

3.0  Function-based API替代传统的Class API,摒弃高阶组件

优势:
复用简单,把要复用的逻辑抽取到函数中,
如果不使用就不用压缩打包(更小)
解决高阶组件的弊端(性能消耗,反复使用)备注2*
不在需要2.0 Mixin的复用逻辑(解决命名冲突)备注3*

实现的方式:
Function API主要是通过简洁的命名规则,把逻辑做成键值对的形式,对于需要用到的方法,我们只需要解构就好了,这样的结构更加清晰.
也就说有了FunctionAPI,我们以后就不需要再用高阶组件,这种看着好用,其实浪费性能的方式

备注1:尤大设计vue的初衷就是不支持ie浏览器,他觉得迟早要淘汰的东西考虑它干嘛,然而ie11还没死就没法子了,国内之前有团队使用支持ie的框架,费劲.

备注2:高阶组件的实质就是一个组件中返回另一个组件,高阶组件的弊端一个是命名时候存在冲突,使用诸如命令时候,和Mixin一样存在命名冲突,多用的高阶组件例如Mixin(组件1(组件2))一旦更新其中一个就会导致全部更新,也就是说西能差了3倍到4倍

备注3:vue2.0多组件复用逻辑用Mixin,但是一旦注入逻辑的时候,由于命名的原因常常不知道是谁注入进来的

补充尤大的回答
Q1:尤大自己会不会考虑做一个专门给vue用的UI框架
A:不–会,因为没有时间

Q2:javaScript这种语言会不会被国外大厂用其他的语言取代
A:大厂没有这个能力,他们说了不算,实际上这是各个浏览器决定的,如果强行要改JS还要融入到其他的浏览器中,实际上这就是变相的做成一种语法糖了.

Q3:有没有考虑过用vue取代React
尤大的意思是不会,原因忘记了

PS.代码后续补充上来,包括vue和各家的对比

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值