一种基于依赖收集的最小化更新组件技术-唐霜

最近被react的性能问题折腾惨了，在实【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。际项目开发中，组件的深度可能很深很深，而【本文受版权保护】本文版权归作者所有，未经授权不得转载。react的更新机制本质上还是一种全量的原创内容，盗版必究。转载请注明出处：www.tangshuang.net脏检查，也就是从当前组件开始，把它作为根【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。节点的整棵树都检查一遍，并且在这过程中做转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】diff，中间涉及一些算法，这些算法说来未经授权，禁止复制转载。【原创内容，转载请注明出处】说去还是因为它存在性能问题，需要靠复杂的【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】算法来迎合react这种脏检查带来的坏处【转载请注明来源】【转载请注明来源】。那么，有没有一种办法，可以避免这种脏检本文作者：唐霜，转载请注明出处。【版权所有，侵权必究】查，也就是在整棵树中，我只需要更新其中一【作者：唐霜】未经授权，禁止复制转载。个节点即可。Mobx提供了一种创新的方法【本文受版权保护】【作者：唐霜】，就是对组件所需要的数据进行收集，只有当原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.net这个数据发生变化的时候，这个组件才需要重原创内容，盗版必究。原创内容，盗版必究。新渲染。这里面还涉及到整个项目中所有组件本文作者：唐霜，转载请注明出处。【未经授权禁止转载】本身的设计问题。本文尝试基于mobx的这转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。种思路，提出一种基于依赖收集的最小化更新本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】组件技术。

【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】

React组件性能优化的途径【版权所有】唐霜 www.tangshuang.net

原创内容，盗版必究。【作者：唐霜】原创内容，盗版必究。

单纯从优化的途径出发，React组件有以【作者：唐霜】【原创不易，请尊重版权】下几种途径可以让开发者进行性能优化：

转载请注明出处：www.tangshuang.net原创内容，盗版必究。转载请注明出处：www.tangshuang.net

PureComponent【原创不易，请尊重版权】

【转载请注明来源】

本文作者：唐霜，转载请注明出处。

未经授权，禁止复制转载。

【访问 www.tangshuang.net 获取更多精彩内容】

shouldComponentUpdat著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。e

【作者：唐霜】

【本文受版权保护】

【关注微信公众号：wwwtangshuangnet】

React.memo【本文首发于唐霜的博客】

【原创内容，转载请注明出处】

本文版权归作者所有，未经授权不得转载。

原创内容，盗版必究。

著作权归作者所有，禁止商业用途转载。

其中PureComponent实际上内置【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。了shouldComponentUpda【作者：唐霜】【本文首发于唐霜的博客】te的特殊逻辑。React.memo针对【本文受版权保护】【关注微信公众号：wwwtangshuangnet】functional组件，本质上还是差不【本文受版权保护】【本文首发于唐霜的博客】多，通过对比props来决定是否要更新当本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。前组件。但是注意，shouldCompo【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】nentUpdate可以控制this.s【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。tate的变化引起更新，而React.m【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.netemo无法控制useState带来的更新【原创内容，转载请注明出处】【版权所有，侵权必究】。

【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】

响应式本质【作者：唐霜】

本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net原创内容，盗版必究。

无论是vue还是react，都是响应式视【转载请注明来源】本文版权归作者所有，未经授权不得转载。图框架，通过修改数据来达到改变界面的效果著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。。响应式是现代前端框架的基本要求。对于开【本文受版权保护】未经授权，禁止复制转载。发者而言，应该透过响应式的表象，看到它的【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】本质——观察者模式/订阅发布模式。vue【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.net通过对数据劫持，在发生数据变化时，执行劫著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。持代码中的触发逻辑，触发更新机制。rea【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。ct则是在setState等接口被调用时【原创不易，请尊重版权】【未经授权禁止转载】，触发更新机制。它们本质上都是通过一个方本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。式触发更新。

基于这一理解，我们再看redux，它是一【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.net个状态管理器，在和react结合使用时，原创内容，盗版必究。【未经授权禁止转载】本质上，它也是订阅发布器。只是库的作者封【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。装了store.subscribe/st【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.netore.dispatch方法，让很多开发【关注微信公众号：wwwtangshuangnet】【作者：唐霜】者只看到状态的变化，没有看到订阅发布的过本文作者：唐霜，转载请注明出处。【本文受版权保护】程。这实际上启发我们理解一个核心问题：单向双向数据流也好，immutable或未经授权，禁止复制转载。【未经授权禁止转载】mutable也好，不是react或vu本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。e界面更新机制的必要条件，必要条件是触发过程，也就是说，无论是哪【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。种数据流或哪种数据形态，只要数据变化之后原创内容，盗版必究。未经授权，禁止复制转载。，能够触发框架的更新机制，就可以完成更新【未经授权禁止转载】【原创内容，转载请注明出处】。

本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。

这有什么用呢？原创内容，盗版必究。

我们不需要redux或vuex，我们可以转载请注明出处：www.tangshuang.net【作者：唐霜】用mobx了。Mobx和前两者都有巨大的【原创不易，请尊重版权】【未经授权禁止转载】不同，你可以把它当作一个状态管理器，但是【本文受版权保护】【本文受版权保护】，本质上，它不是专门为前端框架们特制的一未经授权，禁止复制转载。【转载请注明来源】个状态管理器，它是一个通用的数据模型生成本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net器。当你需要对一个物品/对象进行描述时，著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。可以用Mobx对该物品/对象进行描述，有未经授权，禁止复制转载。未经授权，禁止复制转载。什么属性，什么方法，都可以定义在Mobx【本文受版权保护】本文作者：唐霜，转载请注明出处。的模型上。而mobx提供了多个方法，可以原创内容，盗版必究。【原创内容，转载请注明出处】帮助开发者对这些属性和方法，做更加深入和原创内容，盗版必究。【未经授权禁止转载】魔幻的控制，比如让一个属性的值依赖另外一【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。个属性的值，被依赖属性的值发生变化时，该【作者：唐霜】原创内容，盗版必究。属性的值也自动变化。所以，抛开前端框架来著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。讲，它只是一个用于创建数据的模型生成器。【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。另外，你可以通过它的接口，订阅模型示例上转载请注明出处：www.tangshuang.net【未经授权禁止转载】属性的变化，至于界面的更新，则是把框架的【未经授权禁止转载】【原创内容，转载请注明出处】更新机制的触发接口丢到这个订阅函数中去。【版权所有，侵权必究】【转载请注明来源】如果你需要一个理解起来更简单的数据模型，原创内容，盗版必究。【未经授权禁止转载】可以尝试我写的模式库tyshemo(np本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】m i tyshemo)来做这个响应式的著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。模型对象。

【关注微信公众号：wwwtangshuangnet】【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。【本文受版权保护】本文版权归作者所有，未经授权不得转载。

// 假如 model 是一个可订阅的对象
function ReactComponent(props) {
  const [, setState] = useState({})

  useEffect(() => {
    const forceUpdate = () => setState({})
    model.subscribe(forceUpdate)
    return () => model.unsubscribe(forceUpdate)
  }, [])

  // ....
}

这是最最最简单的实现了，可以看到，我们已【原创内容，转载请注明出处】未经授权，禁止复制转载。经可以用一个react之外的可订阅对象完转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。成react的响应式更新，也就是说，当我原创内容，盗版必究。未经授权，禁止复制转载。们在该组件外更新了model，那么该组件本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】就会被更新。如果我们在多个组件中都做了这【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】个操作，那么这些组件都会随着model上原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。属性的变化而进行更新。

【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。

依赖收集【关注微信公众号：wwwtangshuangnet】

简单说，依赖收集就是你可以知道在一段代码本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。执行过程中，哪些数据被读取了。这种能力在【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。vue的computed属性中体现的尽致本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】淋漓，vue通过执行computed函数【版权所有】唐霜 www.tangshuang.net【关注微信公众号：wwwtangshuangnet】，知道该计算属性依赖了哪些其他的属性，那【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】么当被依赖的属性发生变化时，计算属性的计原创内容，盗版必究。【原创内容，转载请注明出处】算器就会再执行一次，得到新的值。

本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。

怎么实现依赖收集呢？vue3使用了Pro本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】xy作为响应式的底层技术，我们简单看下P未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。roxy的依赖收集的实现：

【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】【原创内容，转载请注明出处】【转载请注明来源】【本文首发于唐霜的博客】

const deps = []

const data = new Proxy({ a: 1, b: 2 }, {
  get: (target, key) => {
    deps.push(key)
    return target[key]
  },
})

function collect(compute) {
  deps.length = 0
  const computed = compute()
  const computedDeps = [...deps]
  deps.length = 0
  return [computed, computedDeps]
}

// 试试看
const [computed, computedDeps] = collect(() => {
  const { a, b } = data
  return a + b
})

你看，通过对数据拦截，我们可以非常轻松的【作者：唐霜】【关注微信公众号：wwwtangshuangnet】知道一个计算过程，依赖了那些其他属性。

【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】【原创不易，请尊重版权】

但是，著作权归作者所有，禁止商业用途转载。

有的情况下，在计算时，存在if̷【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net0;else分支，这会导致第一次运行co著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】mpute时，有些依赖并没有收集到。这是【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】一个非常重要的点，我会在下面详细讲解我的【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。思路/理念。

【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。【未经授权禁止转载】

基于依赖更新组件【原创内容，转载请注明出处】

一个组件中，使用到了那些数据，可以通过依转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】赖收集收集到，而该组件是否需要更新，只需【访问 www.tangshuang.net 获取更多精彩内容】未经授权，禁止复制转载。要看这些依赖是否有更新就可以了，其他属性【作者：唐霜】【访问 www.tangshuang.net 获取更多精彩内容】的变化，我并不关心。比如：

function SomeComponent() {
  const { a, b } = model

  // 再做一次上面那段关于用setState订阅model更新组件的活
  // ...
}

如果按照我们最前面的那段代码来跑，那么m【转载请注明来源】【作者：唐霜】odel上的任何可能引起更新的属性变化，本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。都会触发该组件更新，但是，实际上，这个组【作者：唐霜】【版权所有，侵权必究】件，只依赖了model的a,b这两个属性【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net，其他属性的变化，其实每必要触发本组件的转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】更新。

【本文受版权保护】【未经授权禁止转载】【本文首发于唐霜的博客】【本文首发于唐霜的博客】

在mobx中，提供了一个observer【原创内容，转载请注明出处】原创内容，盗版必究。的方法，使用如下：

【本文受版权保护】转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。

const TodoView = observer(({ todo }) => (
    <li>
        <input type="checkbox" checked={todo.finished} onClick={() => todo.toggle()} />
        {todo.title}
    </li>
))

用observer包裹一个组件，那么这个本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。组件内使用那些store上的属性，就可以著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。被收集到。而正因为收集到了对应的属性，所【版权所有】唐霜 www.tangshuang.net【本文受版权保护】以，只有当store中的item.tod【关注微信公众号：wwwtangshuangnet】【原创不易，请尊重版权】o发生变化时，才更新该组件。而在使用到s本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】tore的其他组件中，可能又依赖其他属性【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。。总之只有被依赖的属性发生变化时，这个组【作者：唐霜】【版权所有】唐霜 www.tangshuang.net件才更新。

【作者：唐霜】【本文受版权保护】原创内容，盗版必究。【未经授权禁止转载】【未经授权禁止转载】

那要怎么去实现呢？我们只需要揉合前面关于本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。订阅和依赖收集的两段代码，就可以实现了。

转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】

const observe = (model) => (InsideComponent) => {
  return React.memo(function OutsideComponent() {
    const data = new Proxy(model, { ... })
    // ... 省略了一堆
    const [vdom, deps] = collect(() => <InsideComponent model={data} />)
    const hash = getObjectHash(deps)
    // .. 省略了一堆
    useEffect(() => {
      model.subscribe(deps, forceUpdate)
      return () => model.unsubscribe(deps, forceUpdate)
    }, [hash])

    return vdom
  }, () => true) // true表示不更新（它代表新旧props相等，所以不更新）
}

中间省略了collect等那些。使用Re转载请注明出处：www.tangshuang.net【作者：唐霜】act.memo直接隔绝了组件内部和外部【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。，外部的props不会导致组件内的函数执【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。行。总而言之，通过上面这样一通操作，被o【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】bserve柯里函数返回的组件，就是一个【本文受版权保护】【转载请注明来源】基于根据依赖model上的对应的属性发生【本文受版权保护】【本文首发于唐霜的博客】变化时才更新的组件。

条件分支依赖【原创不易，请尊重版权】

在前文提到，如果在依赖收集时，如果存在i【原创不易，请尊重版权】【转载请注明来源】f…else，在第一次收集时本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。，部分依赖没有被收集到，怎么办呢？这里，转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】我想说一个话题，就是，我们常常希望做到准【关注微信公众号：wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】确和全面，但是实际上，大部分情况下，我们【转载请注明来源】原创内容，盗版必究。只需要覆盖到大部分需求，再对特殊场景进行本文作者：唐霜，转载请注明出处。【未经授权禁止转载】处理即可。

【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。

【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】

function SomeComponent({ model }) {
  const { a } = model
  if (a) {
    const { b } = model
  } 
  else {
    const { c } = model
  }
  // ....
}

这个典型的例子，我们再去看看，你会发现，【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】其中的a是关键，而不是b,c，当a为tr【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】ue时，b的变化影响组件的更新，而c不会未经授权，禁止复制转载。【版权所有，侵权必究】影响更新。既然如此，为什么我们要订阅c的原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】变化呢？同样的道理，a为false的时候【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net，我们也不需要订阅b的变化。如果我们把全【转载请注明来源】【版权所有，侵权必究】部依赖一次性订阅，那实际上反而会有浪费。

【未经授权禁止转载】【原创不易，请尊重版权】【未经授权禁止转载】转载请注明出处：www.tangshuang.net

基于这个场景，我们需要动态的订阅和弃订被本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】依赖的属性。当当前收集到的依赖发生变化时转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。，组件函数会重新运行，运行时，我们会收集【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。到新的依赖，当我们发现新的依赖列表和旧的【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshuang.net依赖列表不同时，就代表我们要重新订阅了。

结语【转载请注明来源】

本文讲解了一种基于依赖收集的组件更新思路【原创不易，请尊重版权】【转载请注明来源】，在具体讲解中，没有把具体的细节都写出来原创内容，盗版必究。【原创不易，请尊重版权】，需要读者自己去实践补充。其中关键点在于【本文首发于唐霜的博客】【作者：唐霜】：

原创内容，盗版必究。本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。【关注微信公众号：wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】

通过React.memo隔绝外部脏检查机【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。制

【作者：唐霜】

【原创内容，转载请注明出处】

【本文受版权保护】

脱离react生态的订阅发布模式数据模型

【本文首发于唐霜的博客】

【原创不易，请尊重版权】

【本文首发于唐霜的博客】

依赖收集的实现本文版权归作者所有，未经授权不得转载。

转载请注明出处：www.tangshuang.net

【作者：唐霜】

转载请注明出处：www.tangshuang.net

坦然面对条件分支的依赖收集著作权归作者所有，禁止商业用途转载。

【访问 www.tangshuang.net 获取更多精彩内容】

【原创不易，请尊重版权】

本文版权归作者所有，未经授权不得转载。

通过这样的处理之后，我自己在项目中发现组【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。件响应变得非常快。或许对于正在寻找方案的【本文受版权保护】【未经授权禁止转载】你也有借鉴意义。如果你觉得本文对你有帮助【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。，可以在播客下方留言。

【关注微信公众号：wwwtangshuangnet】【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net【未经授权禁止转载】本文作者：唐霜，转载请注明出处。

本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net【未经授权禁止转载】【转载请注明来源】【作者：唐霜】转载请注明出处：www.tangshuang.net原创内容，盗版必究。未经授权，禁止复制转载。【转载请注明来源】本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。【本文受版权保护】【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】【未经授权禁止转载】【作者：唐霜】【关注微信公众号：wwwtangshuangnet】【本文受版权保护】本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。【未经授权禁止转载】【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】【本文受版权保护】【原创不易，请尊重版权】【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。原创内容，盗版必究。转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】【作者：唐霜】著作权归作者所有，禁止商业用途转载。【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。【本文受版权保护】【本文受版权保护】【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】【关注微信公众号：wwwtangshuangnet】【转载请注明来源】本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net

2021-05-12 5160

唐霜

一种基于依赖收集的最小化更新组件技术

React组件性能优化的途径【版权所有】唐霜 www.tangshuang.net

响应式本质【作者：唐霜】

依赖收集【关注微信公众号：wwwtangshuangnet】

基于依赖更新组件【原创内容，转载请注明出处】

条件分支依赖【原创不易，请尊重版权】

结语【转载请注明来源】

为价值买单，打赏一杯咖啡

声明

关于

生态