Should I use ref or findDOMNode to get react root dom node of an element? : <p>I'm on a situation where I want to make some dom-node size calculations (top, bottom and size properties of the rendered DOM node)</p>

<p>What I'm doing right now, on the <code>componentDidUpdate</code> method is to call findDOMNode on this:</p>

<pre><code> componentDidUpdate() {
        var node = ReactDOM.findDOMNode(this);

        this.elementBox = node.getBoundingClientRect();
        this.elementHeight = node.clientHeight;
        // Make calculations and stuff
}
</code></pre>

<p>This is working fine, but I'm a bit worried about performance, and react best practices. Several places talks about using <code>ref</code> property instead of findDOMNode, but all of them are for child dom elements, on my case I only want the root DOM node of my component. </p>

<p>The alternative using ref may look like this:</p>

<pre><code>render(){
   return (
            &lt;section // container
                ref={(n) =&gt; this.node = n}&gt;
                 // Stuff
            &lt;/section&gt;
}
 componentDidUpdate() {

        this.elementBox = this.node.getBoundingClientRect();
        this.elementHeight = this.node.clientHeight;
        // Make calculations and stuff
}
</code></pre>

<p>To be honest, attaching a ref callback to my root dom node just to get it's reference does not feel correct to me.</p>

<p>What is considered the best practice on this case ? Which one has better performance ?</p>
