前端底层小码农

vue框架对于数据的改变是敏感的，其能具体准确知道是哪一个数据改变， 所以vue是能对更新粒度进行控制，在vue1中是细粒度的更新（dom小范围更新），所以内存占用高，性能消耗大。 在vue2以后改变为中等力度的更新，定位在组件级别，一个组件包含大量状态，在一个事件循环周期内，…

1. 计算属性computed优点和简单用法 计算属性本身惰性的，可以对值结果进行缓存， 只有计算属性依赖的值发生改变后， 计算属性才会进行计算，获取最新的值。相比于普通函数，计算属性节省了不必要的函数执行造成的性能消耗 2. 计算属性逻辑实现 首先dirty和_value值，…

2. 执行patchChildren进行子元素dom对比的流程 3. patchKeyChildren进行新旧虚拟dom的子元素都为多个的复杂情况 头部不相同后，从尾部开始对比，尾部对比如果相同e1--、e2--。前后虚拟dom不同或i大于e1或e2后结束尾部对比 4. 新老虚…

1. loader的分类及运行机制 1. 每个loader都是一个函数，一个loader分为normal-loader 和pitch-loader（此loader可以不实现）， 我们都知道webpack.config.js文件中配置的loader是从下往上， 从右往左执行， 这…

理解vue3的初始化渲染过程首先要弄清楚vue3非常重要的两个核心模块runtime-dom和runtime-core。 runtime-dom名字中有dom， 明显可以看出runtime-dom是和平台相关的操作，所以和平台操作相关的东西全部封装在runtime-dom模块中…

reactive, 此api可实现对数据转换为响应式数据，保证经过reative转换过的数据使用后，改变数据，界面能随之更新。 1 rective函数中调用createReactiveObject函数创建响应式对象， 因为在源码中不光有有reactive数据， 还有readOn…