将DOM操作直接放在参考回调中

Question

class Component extends React.Component {
  render() {
    <div
      ref={(ref) => {
        // Use DOM Api here directly, something like
        // ref.querySelector('.someclass').thirdParty().init()
      }}
    >
      ...
    </div>
  }
}

在上面的代码中，将DOM操作直接放在ref回调中是不错的做法？

我主要担心效果，因为我不确定ref内部调用React的频率。

与以下方法相比，（我正在使用atm）

class Component extends React.Component {
  componentDidMount() {
    // Use DOM Api here, something like
    // this.someRef.querySelector('.someclass').thirdParty().init()
  }
  render() {
    <div
      ref={(ref) => this.someRef = ref}
    >
      ...
    </div>
  }
}