六花亭のサイトが、端末に依っては中々重いという話があった。
https://www.rokkatei.co.jp/
表紙の背景に寸法「2560 × 2000」の透過画像を十枚重ねて、CSS のアニメーションで opacity を変動させてあるみたい。視覚的には大して目立たないのに…。
フレームレートが無駄に高いという事が言えそう。ホワーンと明滅する表現に 60 fps も要らない。現状、アニメーションの描画頻度を意図的に控える手段はページの作成者にも閲覧者にもない。(animation-timing-function の steps(…) で見た目はそうなるけど、少なくとも私が観察した限り、Chrome は見た目に更新のないフレームも再描画をサボってくれない。)わざわざスクリプト制御で頻度を下げて更新するとかいう面倒臭い作りが必要になりそう。
GitHub の issue として WHATWG の議論があった。2019 年に提起されて、まだ結論を見ていない。
https://github.com/whatwg/html/issues/5025