Javascript 反应工具提示fire componentDidupdate在滚动条上

我有一个自定义编写的react工具提示组件，但当它使我的应用程序变得滞后时，因为它接受ref并触发component多次更新以获取节点的位置以计算工具提示内容的位置

componentDidUpdate(prevProps, prevState) {
    const { position, visible } = this.state;
    const wrapperRect = this.wrapperRef?.getBoundingClientRect();
    const contentRect = this.contentRef?.getBoundingClientRect();
    const scrollTop = window.screenTop;
    
    if (contentRect && wrapperRect) {
      const { height } = contentRect;
      const { top } = wrapperRect;
      const calculatePosition = prevProps.position || (top - scrollTop > height ? Position.TOP : Position.BOTTOM);
      if (calculatePosition !== position || visible !== prevState.visible) {
        this.setState({ position: calculatePosition });
      }
    }
  }

---

我如何优化它？当我在一个页面上几乎没有工具提示时，情况会更糟。

在做任何事情之前，考虑将

prevState.position

和

prevProps.position

与

this.state.position

进行比较else@fortunee比较

this.state.position

和

prevProps.visible

可以吗？你是问还是问陈述事实@爱丽丝_morgan@fortunee两者都有？好的想法是你不想运行整个

wrapperRect

和

contentRect

等。如果前一个状态/前一个道具等于当前道具/状态