mcpField
T
threejs-procedural-fields

threejs-procedural-fields

github.com/linegel開発11129 回インストール5 週間前に更新
リポジトリ

threejs-procedural-fields について

Three.jsのシェーダーや各種処理向けにプロシージャルフィールドを作成するスキルです。決定的な出力契約とTSLコアを定め、評価方法、フィルタリング、誤差、診断の設計を支援します。

主な機能

  1. 01座標・シード・出力契約の定義
  2. 02各段階で使えるTSLコアの構築
  3. 03直接評価と保存の比較
  4. 04利用側に応じた周波数と導関数のフィルタリング
  5. 05リビジョン・無効化・診断の管理

活用シーン

  1. 01複数のシェーダー段階で場のロジックを再利用
  2. 02実時間評価とベイクの選択
  3. 03CPU・GPU・保存データの整合性確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/linegel/threejs-complete-set-of-skill --skill threejs-procedural-fields

インストール後、Claude Code で/threejs-procedural-fieldsを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

LICENSE
agents/
openai.yaml
examples/
cpu-tsl-field-parity.mjs
references/
field-stack-recipes.md

詳細

プロシージャルフィールド

決定論的なフィールドバンドルを一つ作成し、それを各シェーダーステージとコンシューマーに合わせて調整します。座標、シード、原因、微分値、出力の意味はフィールドに属します。フラグメントのフットプリント、頂点の LOD、ストレージ、診断はコンシューマーアダプターに属します。

複数システムにまたがる作業では、$threejs-choose-skills を任意のコーディネーターとして利用できます。マテリアルは PBR 応答を、ジオメトリはトポロジーを、水は自由表面の状態を、最終画像スキルはトーンマッピングと出力変換を担当します。システム間でフィールド出力を公開する際は、単位、座標/フレーム規約、生成側と使用側の担当者、リビジョン、空間的/時間的なサポート範囲とフィルター、有効範囲、誤差上限、更新間隔、古さの判定規則を明記します。GPU リソースのレイアウトとレンダリング LOD は、使用側のアダプターに非公開で保持します。

1. フィールドの契約を確定する

実装前に記録します。

coordinate domain and units
seed owner, hash/noise family, and wrapping convention
primary fields -> derived causes -> named outputs
consumer, filter, precision, update cadence, and validity per output
direct-versus-bake decision inputs
debug view and invalidation key per output

原因に基づいて座標を選びます。地形や天候にはワールド座標/タイルローカル座標、惑星には変形前の動径物理座標、装飾にはオブジェクト/ローカル座標、または宣言済みの生成テクスチャドメインを使用します。広大なドメインでは、f32 の位相誤差によってフィールドが変化する前に、整数タイルとローカル float の組み合わせ(または別の分割表現)を使います。

すべての出力について、座標/シードの担当者、単位、コンシューマー、フィルター、精度、更新規則、無効状態、診断が一つずつ定まれば、この手順は完了です。

2. どのステージにも移植できるコアを一つ作成する

共有する原因を、決定論的な TSL Fn として実装します。コアにはフラグメント専用の微分値、頂点のカメラポリシー、ストレージレイアウト、ディスパッチ状態を含めません。共通の中間値は .toVar() または同等のローカル変数で一度だけ実体化します。複数の出力で同じワープ、ハッシュ、オクターブチェーンが再構築される可能性がある場合は、生成された WGSL を確認します。

WebGPURenderer を使用し、await renderer.init() の後に renderer.backend.isWebGPUBackend === true であることを確認します。renderer.compute() は通常のコンピュート処理を送信します。r185 では、computeAsync() はキューへの登録前に初期化しますが、GPU 完了フェンスではありません。CPU から確認可能な完了には、map/readback の await、またはキュー完了プロミスが必要です。timestamp-query の設定だけでは、完了もコストも証明できません。

パリティが重要なシードは f32 ではなく u32 として扱います。床関数で求めた格子座標は、ビット再解釈の前に i32 の範囲内であることを検証します。ドメインワープは座標に一度だけ適用し、そのヤコビアンを解析的勾配に反映します。球面ワープは再正規化の前に接平面上に保ちます。

整数格子を使う CPU/TSL パリティ分岐を実装する前に、正規のパリティコアを読みます。ここでは、符号付き i32 の範囲チェック、ラップする Math.imul/TSL uint ハッシュ、正確な上位 24 ビット正規化、フィールドスペクトルを規定しない共有 .toVar() バンドルを示しています。CPU 呼び出し側は valid === false を拒否します。TSL 呼び出し側は、ハッシュ/値を使用する前に、valid ノードを明示的なマスク、select、または無効状態の診断に渡します。

すべてのコンシューマーが同じ原因グラフを呼び出し、共有される各中間値が呼び出しごとに一度だけ評価され、各ステージの制約がアダプター内に分離されていれば、この手順は完了です。

3. 直接評価とストレージを選択する

償却間隔を 1 回分として比較します。

Tdirect = sum_i(Q_i * E_i)

Tbake = (D * (E_bake + Wstore) + Tdispatch + Tmips) / U
      + sum_i(Q_i * (S_i + B_i / BW_effective))

Q_i はコンシューマー i の実際のワークロードです。フラグメントのワークロードは、解像度、カバレッジ、MSAA/ヘルパー、およびオーバードローから測定またはモデル化します。D はダーティテクセル数、U は再利用フレーム数で、残りの項は制御されたターゲット測定から得られます。レイテンシー、メモリ、誤差のゲートを満たす範囲で、コストの低い方の経路を選びます。読み取り回数やオクターブ数だけで判断してはいけません。

ベイクする場合は、座標、精度、フィルター、更新間隔、コンシューマーの局所性が共通するチャンネルのみをまとめます。ストレージ用とサンプリング用の使用スコープを分けます。同じ論理フィールドの読み取りと書き込みを更新時に行う場合は、ピンポン方式にします。RGBAFormat + HalfFloatType は、ポータブルな r185 rgba16float 書き込み可能ベースラインです(8 B/texel)。より狭い形式や float32 形式、およびフィルタリングは、実際の WebGPU 機能に対してゲートを設けてください。大きな絶対座標ではなく、ローカル値または正規化値を保存します。

StorageTexture、ミップチェーン、ダーティタイル更新、またはカテゴリ ID テクスチャを追加する前に、 ストレージ、精度、無効化をお読みください。

このステップは、選択した表現について、測定済みのコスト入力、正確なバイト数と同時リソースのライフタイム、チャンネルごとに伝播した誤差、作成・更新・無効化・破棄を一元管理する明示的な所有者が揃った時点で完了です。

4. 各コンシューマーをフィルタリングし、必要な場合に限り CPU との同等性を追加する

ワープ後のフットプリント J' と、バンドの実効サポート周波数 f_support について、次を使用します。

q = f_support * sigmaMax(J')

さらに、q <= 0.5 サイクル/サンプルを満たす必要があります。この上限に達する前にフェードまたはプリフィルターを適用し、除去した傾き/法線のエネルギーをマテリアルの分散/ラフネス経路に移します。ジオメトリのディスプレースメントにもメッシュのサンプリング上限が適用されます。フラグメント微分は、微分が一様なフラグメントアダプターでのみ使用します。頂点およびコンピュートのユーザーには、解析的、記号的、指定されたフットプリント、または保存済みの微分が必要です。

CPU への移植は、ジオメトリ/オフライン生成、事前計算済みのネイティブ階層、または同等性の証拠が必要な場合に限って作成します。TSL と同じ定数、シードの折り返し、正規化、再マッピングを読み込みます。直接評価の f32、サンプリング/補間、保存/量子化の誤差をそれぞれ個別に比較します。しきい値判定には、グローバルな画像許容誤差ではなくガードバンドを使用します。

フィールドがディスプレースメント、分類、保存済みサンプル、または CPU コンシューマーに使われる場合は、 フィルタリングと同等性をお読みください。

このステップは、すべての有効な周波数バンドが該当する画面/メッシュのフットプリントゲートを通過し、CPU/ストレージとのすべての比較で、誤差の発生源、上限、しきい値の挙動が明示された時点で完了です。

5. コンシューマー、無効化、診断を接続する

原因を再現せず、NodeMaterial のスロットやジオメトリ/コンピュート入力を使用します。 データフィールドには NoColorSpace を使用します。カラー テクスチャには実際の伝達関数と色域を指定します。エンコードされた sRGB には SRGBColorSpace、線形 sRGB HDR には LinearSRGBColorSpace を使用し、その他のエンコーディングは明示的に変換します。HDR の作業バッファーは、出力を担当する単一のコンシューマーに渡すまで線形のままにします。

フィールドのシード、座標、アルゴリズム、ソースデータ、エンコーディング、または受け入れ値が変更されたときに、フィールドのリビジョンを変更します。そのリビジョンを依存するミップ、コンター、アンカー、キャッシュ、診断に伝播します。静的フィールドは一度だけ構築し、低速なフィールドは一定の周期で更新し、編集されたフィールドはダーティ領域とすべてのフィルター/微分のハローを無効化します。また、すべてのリソースに破棄処理の所有者を設定します。フレーム処理が重要なコンシューマーは GPU 上にとどめるか、明示的な非同期ミラーを使用します。診断ではレンダーループ外で読み戻しを行えます。

ソース座標、各原因/バンド、微分またはフレーム、パックされたチャネル、選択されたミップ/フットプリント、有効性、直接値と保存値の誤差、最終的なコンシューマーの結果を公開します。ビューがシーンパスを共有する場合は mrt() を使用します。

メートル単位の符号付き距離、海岸線、岸に直交する断面、排水、またはコンターを駆動する分類については、まず メートル単位の符号付き距離と沿岸解析を参照してください。

このステップは、フィールド入力を変更するとすべての依存コンシューマーが無効化され、診断ですべての名前付き出力と失敗状態が公開され、同じ契約に対する再構築で同じ値と識別情報が生成されるときに完了です。

完了

フィールドシステムは、1 つのステージ間で移植可能な原因グラフですべての出力を説明でき、直接生成/ベイク処理とフィルタリングの選択に根拠があり、それらの分岐が存在する場合は CPU、ストレージ、しきい値の誤差が明示され、すべてのシステム間コンシューマーが宣言された単位のバージョン付き有効データを受け取り、再構築、LOD、サイズ変更、破棄を通じて座標、識別情報、ミップ、ダーティ領域、リソースが安定しているときに完成です。

コメント