ぽぴなび

知って感動した技術情報・生活情報や買ってよかったものの雑記です。

【Flutter】(未解決)初回のアニメーションがカクつく問題について

(先に)結論

以下にDocumentが用意されているが、iOS(最近のiPhone)では根本的な解決には至っていない模様。 (2021/01/31現在)

flutter.dev

Androidでは上記で紹介されている対処方法で解決することができる模様。

現象

以下のように、初回のアニメーションにカクつきが生じる。 何度か実行しているとスムーズに実行されるようになるが、アプリの見栄えが悪くなってしまうため重大な問題である。 (Issueでめちゃくちゃ怒ってる方もいました。)

https://flutter.dev/assets/perf/render/shader-jank-df154d7366290e80e57ad785f5e860fccfe0177c1ff0474f9f9eabf4609bcaa2.gif

iOSでの暫定対処

以下で紹介されている3つの方法がある。

Flutter iOS animations are janky on first run - Stack Overflow

ざっくり原因を言うと、OpenGLをやめてMetalを使うようになったために起っている問題らしい。 たぶんFlutter 1.17から。

  • Flutter 1.12にダウングレードする
    • パッケージやらもダウングレードしないといけないうえに、使えない機能があるかもしれない。
  • OpenGLを使ったカスタムエンジンを使う
    • 元々問題があった部分が解決するかもしれないが、他の問題が起きる場合がある(実際に報告されている)
    • FlutterチームはiOSOpenGLをもうサポートしてないので、何か起きても直せない。
  • Metal対応を待つ
    • 現在取り組み中で、2021年初頭を目標に頑張っている。

所感

アニメーションのかくつきに気が付きながらも、デバッグモードだからかなーくらいにしか考えていなかったが、調べてみると思ったよりも深刻な問題だった。 自分の場合は個人アプリで単純に見栄えが悪くなるくらいの問題なので、1.12を試してダメそうならFlutter チームの対応を待つのがいいかもしれないが、 企業アプリとかでこの問題にぶち当たったら大変そう。。。