w3cj/how-llms-work

解決する問題

ほとんどの人はLLMをブラックボックスとして使用しています。このプロジェクトはその箱を開きます：言語モデルが実際にどのように機能するかの主要な各段階を、単純なパターンマッチングのチャットボットからゼロからトレーニングされた完全なトランスフォーマーまで、順に説明します。理論を読むだけでなく、ローカルで実行してリアルタイムで結果を確認できる動作するコードが得られます。

仕組み

このアプリは一連のインタラクティブなデモで構成され、それぞれが同じ3部構成のアーキテクチャに従っています：入力を受け取りSSEを介してイベントをストリーミングするHonoサーバールート、状態を管理しストリームに接続するクライアントフック、そして何が起こっているかを可視化する結果コンポーネントです。5つのセクションは次のとおりです：

1. if文を使用した単純なチャットボット（ELIZAスタイル）で、ストリーミング効果に知能は必要ないことを示します。
2. バックプロパゲーションを介してライブでトレーニングされるXORニューラルネットワークで、複数の層が必要な理由を証明します。
3. ゼロから実装されたByte Pair Encoding（BPE）トークナイザーで、独自のテキストでマージステップをアニメーション表示します。
4. 単語ベクトルを学習し、単語が意味によってクラスタリングされることを示すWord2Vec skip-gram埋め込みトレーナー。
5. ゼロからトレーニングされたデコーダーのみのトランスフォーマー（GPT風）—MLライブラリなし—マルチヘッド因果自己注意、層正規化、フィードフォワード層、バックプロパゲーション、Adam最適化を備え、マルチスレッド並列処理を使用します。

すべてはViteを介してブラウザで実行され、コードはサーバールート、フック、コンポーネントに分割されているため、簡単に検査できます。

対象読者

開発者、学生、またはLLMが実際に内部でどのように機能するかに興味がある人。高レベルのフレームワークに頼らずに数学と実装の詳細を見たい場合に特に役立ちます。JavaScriptとニューラルネットワークの概念に基本的な精通があれば役立ちますが、デモがアイデアを具体的にします。

ハイライト

• 5つのLLM段階すべてを、実行可能なローカルコードでカバー
• 完全にゼロから構築されたトランスフォーマー（MLライブラリなし）
• ライブビジュアライゼーション：アニメーション化されたBPEマージ、埋め込みクラスタリング、トレーニング損失
• 実際のChatGPTパイプラインと同じSSEストリーミングアーキテクチャ
• 元の論文への参照（ELIZA、バックプロパゲーション、BPE、Word2Vec、Attention Is All You Need、GPT-1など）
• 必要なのはNode.js 20+とpnpmのみ