Misskeyのメイン描画部分(タイムライン等)をChromeのインスペクタのRenderingで確認すると main thread scroll repaint になっていて、パフォーマンスに影響を与えている可能性があったから、なんとか off-main-thread scrolling にできないかと調査していた
スクロールコンテナ(になり得るDOM)や flex が入れ子になっていることが原因ではないかとか、height 指定がまずいんじゃないかとか、contain とか sticky が原因じゃないかとかいろいろ疑って試行錯誤の末、コンテナの背景色を指定するだけで解決するという事実にたどり着いた
理屈はよくわからないけど、背景色未指定=要素の背景が透明 という扱いになり、(仮に裏側が真っ白だったとしても)レンダリングエンジン的には裏側を描画するためにメインスレッドで処理しなければならなくなるのかなぁと思った
ただメイン描画部分以外の背景色未指定なスクロールコンテナはメインスレッドにはなってなかったし他にも条件はあるっぽい
If you have a fediverse account, you can quote this note from your own instance. Search https://misskey.io/notes/a5w1wuff1kfl09wr on your instance and quote it. (Note that quoting is not supported in Mastodon.)
しゅいろ