diff options
| author | syuilo <4439005+syuilo@users.noreply.github.com> | 2025-03-28 16:34:21 +0900 |
|---|---|---|
| committer | syuilo <4439005+syuilo@users.noreply.github.com> | 2025-03-28 16:34:21 +0900 |
| commit | 18355a0838fb76cfbff349f9d854a5d9c2641584 (patch) | |
| tree | 9e014433fd653910205dfffaecd98e34dfd48872 | |
| parent | perf(frontend): avoid main thread scroll repaint (diff) | |
| download | misskey-18355a0838fb76cfbff349f9d854a5d9c2641584.tar.gz misskey-18355a0838fb76cfbff349f9d854a5d9c2641584.tar.bz2 misskey-18355a0838fb76cfbff349f9d854a5d9c2641584.zip | |
perf(frontend): avoid main thread scroll repaint
| -rw-r--r-- | packages/frontend/src/style.scss | 8 | ||||
| -rw-r--r-- | packages/frontend/src/ui/deck.vue | 2 | ||||
| -rw-r--r-- | packages/frontend/src/ui/universal.vue | 2 |
3 files changed, 10 insertions, 2 deletions
diff --git a/packages/frontend/src/style.scss b/packages/frontend/src/style.scss index f122f47c06..17080e5fbc 100644 --- a/packages/frontend/src/style.scss +++ b/packages/frontend/src/style.scss @@ -178,6 +178,14 @@ rt { overflow: clip; overflow-y: scroll; overscroll-behavior: contain; + + /* + 理屈は知らないけど、ここでbackgroundを設定しておかないと + スクロールコンテナーが少なくともChromeにおいて + main thread scrolling になってしまい、パフォーマンスが(多分)落ちる。 + backgroundが透明だと裏側を描画しないといけなくなるとかそういう理由かもしれない + */ + background: var(--MI_THEME-bg); } ._pageScrollableReversed { diff --git a/packages/frontend/src/ui/deck.vue b/packages/frontend/src/ui/deck.vue index fc6b023a51..2d1917a346 100644 --- a/packages/frontend/src/ui/deck.vue +++ b/packages/frontend/src/ui/deck.vue @@ -233,7 +233,7 @@ body { } body { - /* NOTE: htmlにも overflow: clip を設定したいところだが、設定すると何故か少なくともChromeでhtmlがmain thread scroll repaint扱いになりパフォーマンスが(多分)落ちる */ + /* NOTE: htmlにも overflow: clip を設定したいところだが、設定すると何故か少なくともChromeで html が main thread scrolling になりパフォーマンスが(多分)落ちる */ overflow: clip; } diff --git a/packages/frontend/src/ui/universal.vue b/packages/frontend/src/ui/universal.vue index d067fe738c..5e64de6ffe 100644 --- a/packages/frontend/src/ui/universal.vue +++ b/packages/frontend/src/ui/universal.vue @@ -223,7 +223,7 @@ body { } body { - /* NOTE: htmlにも overflow: clip を設定したいところだが、設定すると何故か少なくともChromeでhtmlがmain thread scroll repaint扱いになりパフォーマンスが(多分)落ちる */ + /* NOTE: htmlにも overflow: clip を設定したいところだが、設定すると何故か少なくともChromeで html が main thread scrolling になりパフォーマンスが(多分)落ちる */ overflow: clip; } |