Flutter

概要

一つのレシピを書いておけば、どの台所でも同じ料理が作れる ── コンロごとに書き直さずに済む、と想像してください。これがクロスプラットフォームの考え方です。つまり、一組のコードが多くのデバイスで動くということです。Flutter は、Dart 言語で書かれた単一のコードベースからクロスプラットフォームアプリを構築するための、Google のオープンソース UI「ユーザーインターフェース・画面に見える部分」ツールキットです。デバイス自身の画面上のコントロールを再利用するアプローチとは異なり、Flutter は独自のレンダリングエンジンですべてのピクセルを自前で描画するため、iOS、Android、Web、デスクトップのいずれでも UI の見た目と挙動がまったく同じになります。Material と Cupertino の充実したウィジェット群が標準で付属します。

強み

単一の Dart コードベースで iOS、Android、Web、デスクトップを一貫した結果でターゲットにできる。
独自のレンダリングエンジンにより、どこでもピクセル単位で同一の UI を実現できる。
文書を編集すると、ファイルを開き直さなくても変更がその場で反映されるように、ステートフルな Hot Reload はコードの変更を動作中のアプリへ即座に反映するため、イテレーションが非常に高速。
充実した洗練されたウィジェットライブラリと強力なツール群。
カスタムでブランド色の強い、アニメーション豊富なインターフェースに最適。

トレードオフ

ほぼ Flutter 専用で使われる言語である Dart を学ぶ必要がある。
エンジンがアプリに同梱されるため、アプリのバイナリサイズが大きくなる。
ウィジェットを自前で描画するため、プラットフォームネイティブな見た目や操作感の更新が遅れることがある。
深いプラットフォーム統合には、プラグイン経由で依然としてネイティブ（Swift/Kotlin）コードが必要になる。

使いどころ

多くのプラットフォームにわたって、単一のチームで高度に洗練され視覚的に一貫したアプリを出荷したいときに Flutter を選びましょう。特に、各 OS「Operating System・iOS や Android のようなデバイスの中核ソフトウェア」のネイティブウィジェットを正確に再現することよりも、カスタムデザインと滑らかなアニメーションが重要な場合に適しています。

バイブコーディングとの相性

Flutter は AI アシスタントとの相性が良好です。すべてが明確なツリー状に構成されるウィジェットであり、Hot Reload によって生成された UI を数秒で検証できるからです。ツリーを小さく焦点を絞ったウィジェットに分割すること、状態管理を明示的に保つこと（たとえば単一の状態クラスや定番のパッケージを使う）、パフォーマンスのために const コンストラクタを優先することをモデルに指示しましょう。フレームワークが自己完結しているため、生成されたコードが壊れやすいネイティブのセットアップに依存することはほとんどありません。

class Counter extends StatefulWidget {
  @override
  State<Counter> createState() => _CounterState();
}

class _CounterState extends State<Counter> {
  int count = 0;
  @override
  Widget build(BuildContext context) => Column(children: [
        Text('Count: $count'),
        ElevatedButton(
          onPressed: () => setState(() => count++),
          child: const Text('Add'),
        ),
      ]);
}