プログラミング未経験者によるVibe Codingは現実的か

最近ある動画サイトで2つの異なる生成AIにブラウザ上で動く3Dゲームを作らせて比較するという検証動画を見かけました。

プロンプトだけでコードを書かせるいわゆるVibe Codingの能力を比較する試み自体は興味深かったのですが、その結論に至るまでのプロセスを見ていてプログラミングやWeb開発の知識を持たない層がAIを用いてコーディングを行うことの現実的な壁について考えさせられました。

実行環境による制約とフォールバック処理

その動画では最終的に片方のAIが出力したコードは動作が遅く使い物にならずもう一方のAIの方が優れていると結論づけていました。

しかし動作が遅いとされたAIのゲーム画面にはWebGLが利用できない旨を示す短いステータスが表示されていました。これはAIが出力したコードの質というよりも実行環境の問題に起因している可能性が高いです。

動画の投稿者はAIが出力したHTMLやJavaScriptのファイルを保存し、ローカルサーバーを立ち上げずにブラウザから直接ファイルを開いて実行していました。現代のWebブラウザはセキュリティモデルが厳しくローカルファイルを直接開いた場合、CORSの制限により外部モジュールの読み込みやWebGLを用いた描画処理がブラウザの仕様としてブロックされます。

画面にWebGLが使えない状態であることが表示されていたということは、そのAIが生成したコードは単にクラッシュしたわけではなく環境を検知してCanvas APIなどを用いた簡易的な描画処理にフォールバックしていたと考えられます。3Dの空間をソフトウェアレンダリングのような形で処理すれば当然ながら極端に動作は重くなります。

もう一方のAIはThree.jsなどのライブラリを利用したコードを出力していました。成熟した描画ライブラリは実行環境の制約を吸収したり致命的なエラーを回避して適切に処理を継続する仕組みを備えています。片方が明確にハードウェアアクセラレーションが効かないフォールバック状態で動いている状況でこれを単に生成されたコードのパフォーマンスの優劣として比較するのは早計に思えます。

コード中のコメントやAIの補足文は読まれていたか

ここで疑問に思うのは動作が遅かったAIが本当にただ使い物にならないコードを出力しただけなのかという点です。

複雑なWebアプリケーションのコードを出力させた場合、生成AIは単にコードのブロックだけを返すわけではありません。多くの場合出力結果には「ローカルサーバーを立ち上げて実行してください」といったAIによる補足文が添えられていたりコード内に実行方法を示すコメントが記述されていたりします。

しかし動画の投稿者はそうしたコード中のコメントや生成AIによる補足文を読んでいないように見受けられました。Web開発の経験がないと出力されたテキストの意味を読み解こうとせず単にコードブロックだけを安直にコピーしてダブルクリックで開くという手軽な方法をとってしまいがちです。

実際の出力コードを確認していないため断定はできませんが、ブラウザのセキュリティ制約によって本来のパフォーマンスが出せていなかった可能性が高い状態のまま「そのAIは遅くて使い物にならない」という評価が下されてしまったように見えました。

ちなみにAIの出力したコードや補足説明を理解せずにそのまま使ってしまうというのは必ずしも未経験者だけに限った話ではありません。ソフトウェアエンジニアであってもコードの挙動を自身で説明できないままオープンソースプロジェクトにPull Requestを提出してしまうケースが増加していて問題視されるようになっています。

Vibe Codingに求められる基礎リテラシー

プログラミングの知識がなくてもAIに指示を伝えるだけでアプリケーションを作れるVibe Codingが近年もてはやされており、ゼロからコードを書くハードルが劇的に下がったのは事実です。

しかし今回の動画の事例が示しているようにAIが出力したコードを実行し意図した動作にならない際にその原因を切り分ける能力は依然として求められます。

パフォーマンス低下の原因がAIの書いたロジックにあるのかそれとも自分の実行環境にあるのか。これを切り分けるWeb標準やブラウザの仕様に関する基礎知識がないとAIからの忠告を見落とし間違った結論に飛びついてしまいます。ツールがどれだけ進化しても出力された結果を正しく評価し運用するためのソフトウェア開発における基礎的なリテラシーはむしろ重要性を増しているのではないかと感じました。