title: Why would we use useEffect without a dependency array?
body: <p>I have this code:</p>
  
  <pre><code>const App: React.FC = () =&gt; {
    const [isOpen, setIsOpen] = React.useState(true);
    const [maxHeight, setMaxHeight] = React.useState();
  
    const wrapper = React.useRef&lt;HTMLDivElement&gt;(null);
    const content = React.useRef&lt;HTMLDivElement&gt;(null);
  
    const setElementMaxHeight = () =&gt; {
      if (content &amp;&amp; content.current) {
        setMaxHeight(isOpen ? content.current.offsetHeight : 0);
      }
    };
  
    useEffect(() =&gt; {
     setElementMaxHeight();
  
      window.addEventListener("resize", setElementMaxHeight);
  
      return () =&gt; {
        window.removeEventListener("resize", setElementMaxHeight);
      };
    });
  
    const toggle = () =&gt; {
      setIsOpen(!isOpen);
    };
  
    return (
      &lt;div&gt;
        &lt;button onClick={toggle}&gt;
          &lt;span className="nominal-result__expander fa" /&gt;
        &lt;/button&gt;
        &lt;div
          className="nominal-results__list-wrapper"
          ref={wrapper}
          style={!!maxHeight ? { maxHeight: `${maxHeight}px` } : undefined }
        &gt;
          &lt;div className="nominal-results__list" ref={content} /&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    );
  };
  
  const rootElement = document.getElementById("root");
  ReactDOM.render(&lt;App /&gt;, rootElement);
  </code></pre>
  
  <p>This will add and remove an event handler on each render.</p>
  
  <p>Is this necessarily bad and does this actually gain anything from being a hook?</p>
  
  <p>This came up in a code review and I am saying it is bad because it adds and removes the event listener on every render.</p>