Codex vs Gemini CLI Flutter extension 同じプロンプトでFlutterアプリを作らせて比較してみた

Flutter Extension for Gemini CLIが発表されていたので、
https://blog.flutter.dev/meet-the-flutter-extension-for-gemini-cli-f8be3643eaad
同じプロンプトを与えてドメインと画像制限ブラウザアプリを作らせて比較してみる実験をやってみた。

作りたいブラウザアプリの機能

• 設定画面で制限するドメインを決める
• そのドメインにアクセスするには、なぜ使用するのかを明記して30秒待たなければいけない
• ブラウザに画像、動画を表示させないモード設定
• ブラウザ画面がカラーフィルターでグレーアウトを調整できる設定

Gemini CLIの準備

GoogleがFlutter作ってるからいい感じになるか？と期待して試してみた。

Gemini CLIのインストール

https://github.com/google-gemini/gemini-cli

brew install gemini-cli

brew install gemini-cli

/planモードのカスタムコマンド追加

参考

• https://codelabs.developers.google.com/gemini-cli-hands-on?hl=ja#9
• https://codelabs.developers.google.com/gemini-cli-hands-on?hl=ja#10

Flutter extensionのインストール

gemini extensions install https://github.com/gemini-cli-extensions/flutter.git

gemini extensions install https://github.com/gemini-cli-extensions/flutter.git

GeminiにMCP追加

とりあえずserenaとdartを追加

{
  "ide": {
    "enabled": true,
    "hasSeenNudge": true
  },
  "security": {
    "auth": {
      "selectedType": "oauth-personal"
    }
  },
  "mcpServers": {
    "dart": {
      "command": "dart",
      "args": [
        "mcp-server"
      ]
    },
    "serena": {
      "command": "uvx",
      "args": [
        "--from", "git+https://github.com/oraios/serena",
        "serena-mcp-server",
        "--context", "ide-assistant",
        "--enable-web-dashboard", "false",
        "--project", "${PWD}"
      ]
    }
  }
}

{
  "ide": {
    "enabled": true,
    "hasSeenNudge": true
  },
  "security": {
    "auth": {
      "selectedType": "oauth-personal"
    }
  },
  "mcpServers": {
    "dart": {
      "command": "dart",
      "args": [
        "mcp-server"
      ]
    },
    "serena": {
      "command": "uvx",
      "args": [
        "--from", "git+https://github.com/oraios/serena",
        "serena-mcp-server",
        "--context", "ide-assistant",
        "--enable-web-dashboard", "false",
        "--project", "${PWD}"
      ]
    }
  }
}

mcp確認

プロンプトの準備

以下のプロンプトを書いたファイルを読み込みアプリ実装計画を立てる

• yoken.md
• business.md
• flutter_rule.md

GeminiはFlutter extensionの/create-appコマンドを使って実行した。

結果比較

Codex (gpt-5-codex high)

エージェントモードで試したときは手直しなしでいい感じに動いた。

できたもの

• グレーアウト機能 ✅ 動作OK
• 画像制限機能 ✅ 動作OK
• ドメイン制限機能 ⚠️ YouTubeに解除してるのにアクセスできなかったりして完璧ではないけど、おおむね動く(これはflutter_inappwebviewではサポートしきれないかも)

Gemini CLI

実装中にパッケージの依存関係が解決できず手直しが必要だった。

できたもの

• 設定画面、ダッシュボード画面から戻れない
• 設定画面に遷移するとエラー
• ドメインを制限する機能もちょっと要件と違う実装になってた（理由を入力する状態から30秒カウントを開始していた）

まとめ

同じプロンプトでも結果は結構違った。Codexの方が手直しなしで動くものができた印象。Gemini CLIはFlutter専用の拡張があるものの、依存関係の解決やUI周りでつまづいた。