update height with request animation frame

updateHeightRAF.js

updateHeight(isOpen) {
  this.lastRAF && cancelAnimationFrame(this.lastRAF);
  if (isOpen) {
    this.lastRAF = requestAnimationFrame(() => {
      // read:
      const height =`${this.contentEl.scrollHeight}px`;
      this.lastRAF = requestAnimationFrame(() => {
        // write in a different frame:
        this.containerEl.style.height = height;
        this.lastRAF = null;
      });
    });
  } else {
    this.containerEl.style.height = '0px';
  }
}

Why do you nest two requestAnimationFrame ? line 7 & 8.

I bet its to reduce the risk of having the browser to do a recalculate style or recompute style to avoid layout thrashing? Just a guess. See how he reads the DOM in one frame and writes to the DOM in another? Rather than reading and writing in the same frame, but I still dont know if this acutally helps, just my guess @copycut