私の新しいジュニア開発者はちょっとひどいです

その開発者は ChatGPT で、私はそれと愛憎の関係を持っています。

最近は AI に関する記事がたくさんあるので、今回は簡潔にまとめたいと思います。

TL;DR:

ChatGPT を使用してコーディングすることは、自分の下にジュニア開発者がいるようなものです。コードの 80% はそこで取得できますが、実質的にすべての行をレビューする必要があります。

シナリオ

コードの作成に ChatGPT を使用できる方法はたくさんあることを認めざるを得ません。おそらく、いくつかの点では優れており、他の点では劣っているでしょう。

たとえば、検索エンジンとして使用している人がたくさんいると聞きました。個人的にはそれはちょっと疑問です。ドキュメントを見つけたり、検索で答えを見つけたりすることはそれほど難しくありません。毛羽立ちを抑えるKagiを使用しています。

逆に、ChatGPT を使用すると、答えが正しいかどうかをどうやって知ることができるでしょうか?

その一方で、これを美化されたオートコンプリートとして使用している人もたくさんいます。 Github Copilotのようなもの。それが役に立つのはわかります。

私が選んだシナリオは次のとおりです。

コードをchakra-uiからtailwindcssに変換します。

なぜ？

• どちらのテクノロジー、特に Tailwind (そしてもちろん HTML) に関するリソースが豊富にあります。作業に必要なデータがたくさんあるはずです。

• これを行うプログラムを作成することは非常に可能です。特殊なケースはたくさんあるかもしれませんが、機能自体は簡単です。 chakra-ui は追い風からインスピレーションを受けているため、簡単に転送できるものをたくさん継承しています。

• それは私がしなければならないことなのです。したがって、これは他の誰かが遭遇する可能性のある実際の使用例です。

迅速なエンジニアリングは面倒です

フィールドを見回してみると、プロンプトを適切に行うかどうかが、良い結果を得られるか平凡な結果を得られるかの違いであるように思えました。私はこれが得意ではありませんが、いくつか調べて最善を尽くしました。

良好な状態にするために複数のプロンプトを使用するようにしました。コードのみを変換する必要があると認識していると思われる場合は、コードを貼り付けるだけです。

正直なところ、この部分は改善される可能性があります。 UI とインタラクションの間では、使用するのが非常に面倒です。

• 望ましい状態に達するまでに時間がかかる場合があります

  何を書こうか考えて、応答を待って書き終わるまでの間、この作業を行うのはかなり面倒です。

• 矛盾してるよ

  同じプロンプトを常に再利用できるとは限らないのは役に立ちません。 ChatGPT にはランダム性があるため、毎回プロンプトを微調整する必要がありました。以前は機能していたプロンプトをコピーアンドペーストしても役に立ちませんでした。

• 望ましい状態から抜け出すのはとても簡単です

  一回限りのことなら上記で大丈夫です。しかし、AI は最初のコード変換の後は簡単にすべてを忘れてしまうことがわかりました。私が繰り返し成功したのは、おそらく 3 回でした。さらに、コードが何をするのかを説明するなど、まったく関係のない内容が返されました。

• トークンはかなりの制限要素です

  トークンの制限により、生成できるコードは限られています。ここでトークナイザーをチェックして、トークンの計算方法を確認できます。コードにとってはあまりフレンドリーではありません。以下はその出力の 1 つの例です。それぞれの異なる色がトークンを表します。

  
  

  

  このため、変換を複数のステップに分割する必要があります。そうしないと、生成が途中で停止します。続行するように指示しても、ほとんどの場合は機能しません。上記のポイントと組み合わせると、これはすぐに面倒な作業になります。

  
  

  

  
  

全体として、私が感じているのは、英語を書きたくないということです。すでに何かを書かなければならない場合は、機能するコードを直接書きたいと思います。

迅速なエンジニアリングが将来的に重要なスキルとなることがわかります。今日の世界では、検索方法を知ることが重要なスキルであるのと同様です。

出力はそれほど悪くない

かかった作業の割に、ChatGPT はかなり印象的なコードを出力しました。オリジナルと結果の比較は次のとおりです。

ご覧のとおり、きちんと仕事をしてくれました。

いいもの

• 構造はかなりうまく引き継がれています

  詳細を除けば、HTML 構造はオリジナルと非常に似ています。間隔はずれていますが、全体的なレイアウトは残ります。

• テキストの内容は変わりません

  内容自体は丁寧に扱っていただきました。すべてを再確認する必要がありましたが、どれも変更されませんでした。唯一の例外は、JS から派生したものです。

  
  

悪い人

• ランダムクラスだった

  何もしない授業もたくさんあります。変更されたものもあれば、無効な追い風クラスもありました。

• 細かい違いはたくさんありますが、

  UI は、ライブラリがアップグレードされたばかりで、誰かがコードを移行するのを忘れたかのように見えました。この場合、ChatGPT がクラスの値をランダムに変更したことが原因です。たとえば、 paddingを 3 から 4 に変更したり、 font-weight太字から標準に変更したりします。詳細はすべて間違っていました。

• 半分の時間は機能しません

  上のスクリーンショットは直接比較できるものです。実際には、結果は不完全か、単に間違っていたため、機能させるために多くの変更を加える必要がありました。そのため、並べて比較することはできません。コードが実行されないため、比較できるものがありません。

コードを書く代わりに PR をレビューするようなもの

これの素晴らしいところは、取り組むべきものがあるということです。ありがたいことに、作業自体は非常に簡単です。間違いを見つけるのは簡単です。 chakra-ui と tailwind のクラス間のマッピングは、ほぼ 1 対 1 です。構文が違うので面倒なだけです。

しかし、このアプローチは PR をレビューすることに似ています。すべてが正しく行われていることを確認するには、コード全体に目を通す必要がありました。

一見すると大丈夫そうに見えます。しかし、注意深く注意して作業してみると、落とし穴がたくさんあります。それは誤った安心感をもたらすので、すべての欠陥を知った後は少しイライラしました。

その大部分は、他のコードベースから補間されたコードです。見た目は悪くありませんが、私が望んでいたものではありません。

見出しを h2 から h1 に変更するなど、いくつかの驚くべき変更もあります。内容からしてそうなったとしか思えません。

それは、若手開発者が何かを叩きつけてコードをテストしなかったように感じました。そして今度は自分で直せとは言えずに見直して直さなければなりません。

そして、これはひどいことです。私はすでに仕事で PR を見直す習慣を身につけています。今度は自分のプロジェクトでもそれを行う必要がありますか?結構です！

希望に満ちた未来

まだそこまで到達していないと思いますが、将来のある時点で AI が開発に役立つようになると思います。答えが LLM であるかどうかは誰にも分かりません。

トークンの制限は常に増加しています

私はこの記事を完成させるのをずっと先延ばしにしてきました。その間、トークンの上限が引き上げられるという発表がたくさんあります。公開されているのか、有料なのか、その他何なのかはわかりませんが、これを見るのは素晴らしいことです。

UX のプロンプトは時間の経過とともに簡単になるはずです

ChatGPT プラグインと統合の改善により、状態や一貫性の記憶などの問題は改善されるはずです。これにより、ChatGPT から有用な出力を取得するために必要な労力が軽減されることを願っています。

その間に、移行の残りの半分を手動で完了しました。速かったですか？まあ、誰にもわかりません。ほぼ同じような感じでした。しかし、手動で書いたほうがずっと気持ちがよかったです。