vue3.0的特性有哪些?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。
vue是什么软件
vue是一套用于构建用户界面的渐进式JavaScript框架,vue与其它大型框架的区别是,使用vue可以自底向上逐层应用,其核心库只关注视图层,方便与第三方库和项目整合,且使用vue可以采用单文件组件和vue生态系统支持的库开发复杂的单页应用。
<强> vue3带来的六大新特性强>
- <李>
性能:性能比vue2.x块1.2 ~ 2倍
李> <李>树摇晃支持:支持按需编译,体积更小
李> <李>作文API:组合API类似反应钩子
李> <李>自定义渲染器API:暴露了自定义渲染API
李> <李>片段,传送(先天的),悬念:新增三个组件
李> <李>更好的打印稿支持:更好的支持TS
李><>强劲性能强>
vue3.0在性能方面比vue2.x快了1.2 ~ 2倍。
- <李>
重写虚拟DOM的实现
李> <李>运行时编译
李> <李>静态提升与事件侦听器缓存
李> <李>SSR速度提高
李><强> Three-shaking支持强>
vue3。x中的核心API都支持tree-shaking,这些API都是通过包引入的方式而不是直接在实例化时就注入,只会对使用到的功能或特性进行打包(按需打包),这意味着更多的功能和更小的体积。
<强>构成API 强>
Vue2.x中,我们通常采用混合来复用逻辑代码,使用起来虽然方便,但也存在一些问题:代码来源不清晰,方法属性可能出现冲突。因此,Vue3。x引入了构成API(组合API),使用纯函数分割复用代码。和反应钩子的概念相似。
- <李>
更好的逻辑复用和代码组织
李> <李>更好的类型推导
李><强>片段,传送,悬念强>
新增三个组件。
片段在书写Vue2。x时,由于组件必须是一个根结点,很多时候会添加一些没有意义的节点用于包裹.Fragment组件就是用于解决这个问题的(这和反应中的片段组件是一样的)。
传送
传送其实就是反应中的Portal.Portal提供了一种将子节点渲染到存在于父组件以外的DOM节点的优秀的方案。
一个门户的典型用例是当父组件有溢出:隐藏或z - index样式时,但你需要子组件能够在视觉上“跳”出其容器。例如,对话框,悬浮卡以及提示框。
引用>悬念
同样的,这和中反应的Supense是一样的。
悬念让你的组件在渲染之前进行”等待”,并在等待时显示撤退的内容。
引用><强>更好的打印稿支持强>
Vue3.x采用打印稿重写,开发者使用Vue3。x时可以充分体验TS给编码带来的便利。
<强>自定义渲染器API 强>
这个API定义了虚拟DOM的渲染规则,这意味着使用自定义API可以达到跨平台的目的。
<强>最后:Vue3.0是如何变快的? 强>
<李>
diff算法优化
李><李>
<李>Vue2中的虚拟DOM是进行全量对比
李> <李>Vue3新增静态标记
李>hoistStatic静态提升
李><李>
<李>Vue2中无论元素是否参与更新,每次都会重新创建,然后在渲染
李> <李>Vue3中对于不参与更新的元素,会做静态提升,只被创建一次,在渲染时直接复用即可
李>cacheHandlers事件侦听器缓存
李><李>
<李>默认情况下默认情况下onClick会被视为动态绑定,所以每次都会去追踪它的变化,但是因为是同一个函数,所以没有追踪变化,直接缓存起来复用即可
李>ssr渲染
李><李>
当有大量静态的内容的时候,这些内容会被当作纯字符串推进一个缓冲区里面,即使存在动态的绑定,会通过模版插值嵌入进的去,这样会比通过虚拟DOM来渲染的快上很多很多
李> <李>当静态内容大到一定量级的时候,会用_createStaticVNode方法在客户端去生成一个静态节点。这些静态节点,会被直接innerHtml,就不需要创建对象,然后根据对象渲染。
李>看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注行业资讯频道,感谢您对的支持。
vue3.0的特性有哪些