Androidのレンダリングでハマったので対応策を書いてみる
まぁ大したことはしていないのだけど。
* { -webkit-backface-visibility: hidden; }
を追加しただけ。
Androidはレンダリング周りが弱く、CSSでアニメーションさせてもあまり綺麗には動きません。でもゲームのようなものだとやっぱり綺麗にアニメーションさせたい。でも・・というジレンマ。
そこで今回の手法を使うと、レンダリング周りが改善されるかもしれない、というメモ。
この方法は、どこかのバグリストで書いてあったことで、動かしている要素だけに指定してもあまり改善が見られなかったのだけど、思い切って全部につけてみたらだいぶ改善されたイメージ。(とはいえ体感でしかないので、効果が確実にある保証はありません)
これは推測ではあるけど、いわゆるポリゴンのレンダリングで見えていない部分を計算しないことで高速化を図る、ということなのかなと思った。立体的に回転させたり、という表現が必要ない場合は一括して指定しておくと軽くなる・・かもしれない。