性能评测与分析

Browser

DOM elements and mutations
Repaints and reflows
Garbage collection

React

Unnecessary renders
Development build of React

componentDidUpdate(prevProps, prevState) {
  Object.entries(this.props || {}).forEach(
    ([key, val]) =>
      prevProps[key] !== val && console.log(`Prop '${key}' changed`)
  );
  Object.entries(this.state || {}).forEach(
    ([key, val]) =>
      prevState[key] !== val && console.log(`State '${key}' changed`)
  );
}

在类组件中，我们可以通过如上代码来判断某个 Props 或者 State 是否发生变化。

__REACT_DEVTOOLS_GLOBAL_HOOK__.on('update', (e) => { console.log('Updated', e) })

最近更新于 0001-01-01