📝

Flutterはなぜ他のクロスプラットフォームよりも性能がいいのか

2023/11/26に公開

はじめに

Flutterの描画の仕組みを調べて学んだことを自分なりの解釈を加えてまとめてみました。

内容としては、タイトル通り「Flutterはなぜ他のクロスプラットフォームよりも性能がいいのか」です。
※指標を測定したわけではなく、あくまでFlutterの開発チームがそう言っている、というだけなのでご注意ください。

はじめにUIが画面に描画されるまでに行われるプロセスを整理しておきます。

1は開発者が行い、2以降はシステム（OS）側で行われます。

クロスプラットフォームを実現する方法として一般的なのは、
　各UIパーツごとに、Androidならjavaコードに、iosならobjective-cのコードに変換する
というものです

Text(){
  if (Android){
    //javaでのText
    return TextJava
  }
  else if (ios){
    //objective-cでのText
    return TextObjective-c
  }

図で表すと以下のようになります。

※これもどのフレームワークがどんな方法をとっているのか調べたわけではありません。Flutter開発チームが・・・（以下略）です。

これのどこが問題なのでしょうか？
実際のアプリでは画面内に多数のUIが存在します。
上記の方式だと、各プラットフォームの言語に変換する処理がUIの数だけ起こり、このオーバヘッドが大きくなってしまいます。

Flutterの場合は上記のように各プラットフォームの言語に変換するということはしていません。
Flutterが3.ラスタライズまで行います。
下記がFlutterの内部構造ですが、Engineがラスタライズまで行い、OSに依存する部分はEmbedderが担います。

図で描くと以下のようになります。

これにより上記のようなオーバヘッドをなくせますね。