React 多人开发怎么确保性能，有没有最佳实践

[Chuckle]

一个小业务组件，随着需求迭代，越来越大，塞复杂表格、表单等等，上千行都有，导致状态一变连锁反应全都变，就算拆模块，也得 momo 、usecallback 啥的套，很容易又打破，也很麻烦。
像 data-grid 的案例都推荐用上下文去传数据了，避免小变化导致整个表格列重渲，但是在业务里用上下文多了，感觉更难维护数据流。

reference

[shunia]

@shunia #20 加一句：react 或者 vue 等等几乎所有框架，都不是为了性能而生的。

[kakki]

给弹窗组件一个 ref, 直接调用 ref 方法.鸡零狗碎的状态太多就很烦,能自我管理尽量自我管理.

[lanten]

最佳实践是什么，是问出来的吗？这个推荐那个推荐，不如自己推荐

[Gilfoyle26]

@liuidetmks #9 经典

[leokun]

从业务角度来说，表单的性能高低不会有一毛钱的影响

[cwwx2022]

我在网上看到了这个 https://shame-of-react.pages.dev/ ，是关于 react 的

[hahaFck]

@shintendo 这样会有另外一个问题，就是弹窗关闭了，弹窗组件没有摧毁掉，在重新打开后，数据还是跟上次一样的，每次打开都是上次打开的结果，也挺烦的。

[liuliancc]

@Dreamful #5 我一般父元素通过双向绑定 v-mode visible 控制，子元素 prop visible 、emit('change:visible', true/false)，也不会重新渲染、丢失动画

[jianv3]

虚拟列表。 几万条数据也无所谓

[anivie]

@liuidetmks 真的卡的时候想去优化已经不可能了，只有重写，大部分卡的批爆的网页都是这么来的

[AV1]

换个角度想，当你的数据有成千上万行时，你应该考虑提供分页、排序、搜索、筛选、摘要功能，方便用户定位到想要的数据。

[Chuckle]

把 rxjs 和 context 结合起来咋样，需要暴露和传递的数据，别 props 一层层传状态，让组件订阅所需外部状态的变化，而不是从 props 中获取，感觉有空可以琢磨下

[Chuckle]

@Chuckle #32 还真有现成的 https://react-rxjs.org/docs/getting-started ，确实能想到估计也有人做过了（

[RedNax]

想集成 rxjs 可以看看 focal：
https://github.com/grammarly/focal

[Dreamful]

@liuliancc 主要是组件加载时机，有时候不希望子组件一开始就加载，每次打开都重新加载。感觉不如父组件直接加 v-if 省事

[realJamespond]

换 zustand 细粒度更新，直接子组件之间互相作用，绕过 state+context 从根组件全刷

[lstmxx]

@hahaFck 写一个 reset 函数，close 的时候调用吧，我是这么做的