perf(frontend): avoid main thread scroll repaint

This commit is contained in:
syuilo 2025-03-28 16:34:21 +09:00
parent 811077ca66
commit 18355a0838
3 changed files with 10 additions and 2 deletions

View File

@ -178,6 +178,14 @@ rt {
overflow: clip; overflow: clip;
overflow-y: scroll; overflow-y: scroll;
overscroll-behavior: contain; overscroll-behavior: contain;
/*
理屈は知らないけどここでbackgroundを設定しておかないと
スクロールコンテナーが少なくともChromeにおいて
main thread scrolling になってしまいパフォーマンスが(多分)落ちる
backgroundが透明だと裏側を描画しないといけなくなるとかそういう理由かもしれない
*/
background: var(--MI_THEME-bg);
} }
._pageScrollableReversed { ._pageScrollableReversed {

View File

@ -233,7 +233,7 @@ body {
} }
body { body {
/* NOTE: htmlにも overflow: clip を設定したいところだが、設定すると何故か少なくともChromeでhtmlがmain thread scroll repaint扱いになりパフォーマンスが(多分)落ちる */ /* NOTE: htmlにも overflow: clip を設定したいところだが、設定すると何故か少なくともChromeで html が main thread scrolling になりパフォーマンスが(多分)落ちる */
overflow: clip; overflow: clip;
} }

View File

@ -223,7 +223,7 @@ body {
} }
body { body {
/* NOTE: htmlにも overflow: clip を設定したいところだが、設定すると何故か少なくともChromeでhtmlがmain thread scroll repaint扱いになりパフォーマンスが(多分)落ちる */ /* NOTE: htmlにも overflow: clip を設定したいところだが、設定すると何故か少なくともChromeで html が main thread scrolling になりパフォーマンスが(多分)落ちる */
overflow: clip; overflow: clip;
} }