Vue3学习笔记---Vue3带来了什么

LinMeng
• 阅读 641

1. 性能的提升

  • 打包大小减少了41%

  • 初次渲染快55%,更新渲染快133%

  • 内存减少54%

  • ...

    2. 源码的升级

  • 使用Proxy代替defineProperty实现响应式

  • 重写虚拟DOM的实现和Tree-Shaking(是一个通常用于描述移除JavaScript上下文中的未引用代码(dead-code)行为的术语,它依赖于ES2015中的import和export语句,用来检测代码模块是否被导出,导入,且被JavaScript文件使用)

  • ....

3. 拥抱TypeScript

  • Vue3可以更好的支持TypeScript

4. 新的特性Composition API (组合Api)

  • setup配置
  • ref与reactive
  • watch与watchEffect
  • provide与inject
  • 。。。

5. 新的内置组件

  • Fragment
  • Teleport
  • Suspense

6. 其他改变

  • 新的生命周期钩子
  • data选项应始终被声明为一个函数
  • 移除keyCode支持作为v-on的修饰符
  • 。。。
点赞
收藏
评论区
推荐文章
Souleigh ✨ Souleigh ✨
3年前
Vue3.0 高频出现的几道面试题
1.Vue3.0性能提升主要是通过哪几方面体现的?1.响应式系统提升vue2在初始化的时候,对data中的每个属性使用definepropery调用getter和setter使之变为响应式对象。如果属性值为对象,还会递归调用defineproperty使之变为响应式对象。vue3使用proxy对象重写响应式。proxy的性能本来比def
Dax Dax
3年前
前端性能优化
前端性能优化1、减少资源的请求次数和大小压缩合并js和css文件,减少http请求次数和请求资源的大小;在项目中使用webpackglup等打包编译工具2、尽量使用字体图标或者svg图标代替传统的png(jpg)图渲染更快,减少代码体积,且放大不会出现变形等3、使用图片懒加载目的是减少页面第一次加载的http请求次数,实现思路:
凯特林 凯特林
3年前
Vue3.0 高频出现的几道面试题
1、Vue3.0性能提升主要是通过哪几方面体现的?1.响应式系统提升vue2在初始化的时候,对data中的每个属性使用definepropery调用getter和setter使之变为响应式对象。如果属性值为对象,还会递归调用defineproperty使之变为响应式对象。vue3使用proxy对象重写响应式。proxy的性能本来比defineprope
Stella981 Stella981
3年前
React 入门及学习笔记
React构建用户界面的JavaScript库,主要用于构建UI界面。Instagram,2013年开源。特点:1.声明式的设计2.高效,采用虚拟DOM来实现DOM的渲染,最大限度的减少DOM的操作。3.灵活,跟其他库灵活搭配使用。4.JSX,俗称JS里面写HTML,JavaScript语法的扩展。5.组件化,模
Vue3设计思想及响应式源码剖析 | 京东物流技术团队
一、Vue3结构分析1、Vue2与Vue3的对比对TypeScript支持不友好(所有属性都放在了this对象上,难以推倒组件的数据类型)大量的API挂载在Vue对象的原型上,难以实现TreeShaking。架构层面对跨平台dom渲染开发支持不友好,vue
LinMeng
LinMeng
Lv1
争取早日实现“代码自由” wa !!!
文章
50
粉丝
7
获赞
33