2026-06-17 · React

找出数据表格多余的重新渲染

用 React DevTools 的性能分析工具揪出让整张表格重绘的组件。

前言

一段排查流程,涵盖 prop 引用比较、memo 究竟该放在哪里,以及那些不该塞进最重列表里的状态。

现场笔记

在处理 React 问题的过程中,反复出现的几个模式:

  • 简单的版本撑过了每次重构,聪明的版本没有。
  • 边做边写的文档,比事后补写的耐用得多。
  • 同一个问题第二次出现时,它就已经是一个模式了——给它起个名字。

可以直接抄的检查清单

  • 问题可以用一条命令复现。
  • 修复附带一个没有它就会失败的测试。
  • 作者本人之外的人也在自己的机器上跑过。

写在最后

写下未来那个自己真正会读的短版本——这就是全部的诀窍。