ブラウザのスクロール率を取得する

webGLで動的なアニメーションを入れるときに、
ブラウザのスクロール率を計算する必要があったので、メモとして残しておきます。

scrollTop
→ 要素の上から最も上の表示されているコンテンツまでの距離
scrollHeight
→ 要素が垂直スクロールバーを使用せずに、要素の全てのコンテンツを収めるのに必要な距離
clientHeight
→ 表示域の高さ

//ブラウザのスクロール率を計算
let scrollPercent = 0;
document.body.onscroll = () => {
  scrollPercent =
    (document.documentElement.scrollTop /
      (document.documentElement.scrollHeight -
        document.documentElement.clientHeight)) *
    100;
    console.log(scrollPercent);
};