vue3随笔

vite:

相比webpack  webpack先通过入口文件找依赖  然后打包bounder 然后启动devServer

vite  直接启动devServer 然后找依赖模块 由浏览器去请求本地服务返回依赖模块

项目越多模块越大 vite越好

效率提升

  1. 静态提升 

    静态节点  没有动态绑定的内容会提升到render函数和外面去

    静态属性  静态属性也会被提升

   2. 预字符串化

    当编译器发现大量连续静态内容 大概20个  会直接将其编译为一个普通的字符串节点

    虚拟节点会降低很多   vue2没有这个

   3,  缓存事件处理函数

    4.block  tree  vue2对比虚拟节点不知道哪些是静态节点哪些是动态节点  会一层一层比较

    vue3会记录这个节点和后面有哪些节点是动态哪些是静态  直接找到对应的block去比较

    标记1,2

左block[input1, input2]  右block[input1, input2]

  4.PatchFlag

vue2在对比每个节点时  并不知道这个节点哪些相关信息会发生变化  因此只能将所有信息依次比对

会打上  Text ,Class 等变化标记

 

posted on 2024-06-01 18:54  龍瀧尨呀  阅读(1)  评论(0编辑  收藏  举报

导航