使用
componentDidUpdate的DOM操作是这样的。
shouldComponentUpdate对于只有一个始终具有相同道具的单个孩子的组件，A
并不会真正起作用。因此，您应该能够删除它，而性能没有明显差异。
如果您已经分析了应用程序 并确定在这种特殊情况下 确实 有所作为，则可以将元素提升到构造函数中。
这样，React会完全跳过它（有效的工作方式与相同
shouldComponentUpdate）：
class Canvas extends React.Component { constructor(props) { super(props); this._ctx = null; this._child = <canvas ref={node => { this._ctx = node ? node.getContext('2d') : null } />; } componentDidUpdate(prevProps){ // Manipulate this._ctx here } render() { // A constant element tells React to never re-render return this._child; }}您还可以将其分为两个部分：
class Canvas extends React.Component { saveContext = ctx => { this._ctx = ctx; } componentDidUpdate(prevProps){ // Manipulate this._ctx here } render() { return <PureCanvas contextRef={this.saveContext} />; }}class PureCanvas extends React.Component { shouldComponentUpdate() { return false; } render() { return ( <canvas ref={node => node ? this.props.contextRef(node.getContext('2d') : null)} />; }}
