
2026/08/24 5:47
S-式を用いた宣言的 WebGPU
RSS: https://news.ycombinator.com/rss
要約▶
Japanese Translation:
主なメッセージは、pngine が単一のポータブルファイルとしてカスタム WebGPU セットアップを配送することを劇的に簡素化するために設計された新しい声明的ランタイム(runtime)であるという点です。複雑な手続き的なシーケンシングを可読な S-式(S-expression)データに置き換えることで、WebGPU 仕様に完全に準拠し、シェーダーコードはそのまま保ちつつ、perform リストを通じて実行順序を管理可能にしています。このアプローチでは SJON を活用して自動検証を行うことで、マシンの生成や圧縮化などの初期開発段階において、ライブコンテキストの必要性なく安全性を確保します。プレイグラウンドに焦点を当てた従来のツールとは異なり、pngine は Rust、Android、iOS など多様なプラットフォーム間で複雑なグラフィックスのワイヤーリングを共有する際の制限に対処します。これはより上位の抽象化を構築するための堅牢な基盤となり、何千もの GPU パーティクルを含むプロジェクトを単一の描画呼び出しにスケール可能にします。CC0 ライセンスでリリースされ、このバイナリープレビューフォーマットをさらに洗練させるためにコミュニティからの寄与を歓迎しており、ユーザーが手動の配管や言語特有の混乱なしに完全なアプリケーションを配布することを可能にしています。
本文
WebGPU 配線のパッケージ化と共有:「pngine」について
2026 年 8 月 23 日
開発者情報
製品概要:pngine
1. 基本機能
pngine は、S-式(セックスプレッション)による配線処理を用いた非常にシンプルな WebGPU ライブラリです。 以下のコード例は、赤色の三角形を描画するものです。S-式の構造は WebGPU 仕様に 1:1 対応しています。
(shader-module :name code :code """ @vertex fn vertexMain( @builtin(vertex_index) VertexIndex : u32 ) -> @builtin(position) vec4f { var pos = array<vec2f, 3>( vec2(0.0, 0.5), vec2(-0.5, -0.5), vec2(0.5, -0.5) ); return vec4f(pos[VertexIndex], 0.0, 1.0); } @fragment fn fragMain() -> @location(0) vec4f { return vec4(1.0, 0.0, 0.0, 1.0); } """) (render-pipeline :name pipeline :layout auto (vertex :module code :entry vertexMain) (fragment :module code :entry fragMain (target :format preferred-canvas-format)) ) (render-pass :name trianglePass (color-attachment :view context-current-texture :clear-value [0 0 0 0] :load-op clear :store-op store) :pipeline pipeline (draw :vertex-count 3)) (frame :name main :perform [trianglePass])
2. 主要機能(1-2-3 pngine)
-
クロスプラットフォームな配信
- シェーダーや CPU/WASM の初期化を含む WebGPU の配線を、宣言的かつプラットフォーム横断的にパッケージ化・配布可能。
- 対応環境:ブラウザ、Rust (
)、Android、iOS プレイヤー。wgpu
-
検証と LSP(言語サービングプロトコル)
- WGSL レフレーションおよび仕様チェックによる宣言構成の検証。
- ライブな WebGPU コンテキストを必要とせず、即時のエラー・警告生成。
- LSP 搭載:入力中の即時フィードバックが可能。
-
単体でのエクスポート
- 単一の .html、.zip、または .png ファイルとしてエクスポート可能。
の独自性: PNG ファイルはプレビュー画像でありながら、内部に S-式をバイナリ表現(バイトコード)に変換したランタイムとペイロードを埋め込みます。.png
注: 「pngine」の名称由来は、「PNG 一枚で動作するもの」を相手に渡せるという点にあります。
開発の背景と理念
なぜ必要なのか?
- カスタム WebGPU 配線の共有が長年懸念されていた課題でした。
- 目標: パイプライン、バッファ、パス、シェーダーモジュール(WGSL)をすべて記述できる単一ファイルの実現。
- 要件:
- 汎用言語(WebGPU サポートあり)での動作。
- より高い抽象化レベルでの利用。
- 余計な要素への干渉がないこと。
- 他のツールの基盤(サブストレート)としての利用価値。
SJON と設計思想
- SJON (S-expression with JSON-like syntax) を使用し、自動的に検証可能で一貫性のある DSL を構築。
- 配線部分: SJON による記述と管理。
- シェーダーコード: WGSL は独自の DSL として扱い、拡張せずそのままの状態(プリストアイン)を保持。
核となる思想: 「プログラム表現そのものが読み取れるデータである」
- 検証、再実行(プレイバック)、検査、ミニファイ、シリアライズなど、同一の表現に対して多様な機能を適用可能。
- 詳細は SJON の投稿 および専用ページをご覧ください。
WebGPU 配線の課題と解決策
パッケージ化の難しさと pngine のアプローチ
パイプラインを共有する際、以下のような要素で分割されがちです:
- 言語(TypeScript, JavaScript, Rust など)
- ハンドルリファレンスの表現方法
- 用途(アニメーションの一部、ゲームの一部など)
pngine の方針: これらの要素を除去するのではなく、**「サーフェースの削減」**を目指し、異なる目的やターゲットに対して複数の WebGPU ワイヤーを同様の方法でバンドリングします。
WebGPU の静的性
WebGPU の仕様は泥濘なグラフィックスの世界に対し、驚くべき整合性と洗練されたアプローチを適用しています:
- 暗黙的な状態の排除。
- 慎重に設計された API コールや設定オブジェクトへのシフト。
宣言的スペースへの移行
WebGPU の配線は手続き的環境下で行われますが、宣言的空間への変換は即時可能です。これにより:
- 概念とブロックを順序に関係なく記述・操作可能。
- シーケンシングも「何が起こるか」の記述を保持し、適切なタイミングで実行するだけ。
In line with the pipeline (frame :name main :perform [ update-uniforms update-textures sdf-pass post-processing ])
サンプルと応用例
シェーダー共有ツールの位置付け
- Shadertoy: コミュニティや学習リソースが豊富。インスピレーションに最適。
- compute.toys: マルチシェーダー・フィードバック機構を有し、WGSL のマクロ機能も活用可能。
- pngine の位置付け:
- プレイグラウンド機能はないが、LSP は搭載している。
- 制限を加えず、ユーザーが望むマシンをサポートする**基盤(サブストレート)**として機能。
- シーングラフやマテリアルノードなどの荒唐無稽なアイデアを構築するための土台となる。
サンプル 1:CPU を一切使わないパーティクルシステム
[PNG をダウンロード]
- 内容: 2048 の GPU パーティクルを備えたブーリング(バッファ共有)システム。
- 動作: ノズルからの発射、重力による落下、寿命切れ時のランダムな再登場。
- 技術点: 属性バッファへの直接書き込みを含む完全なシミュレーション。
- ドキュメント: パーティクル噴水サンプルページ
サンプル 2:400 本の低ポリゴン木々
[PNG をダウンロード]
- 描画効率: 1 回の描画呼び出しで完了。
- 構造:
- 各木は
フォームで定義され、頂点型(幹のクアドラ+葉の三角形×2)の計 12 個を使用。(data ...) - 位置・スケール・回転・色付けを指定し、計算パスで一度にインスタンス化。
- 各木は
- 実装:
- 同一のパイプライン上で、頂点バッファ内における「個別頂点」と「インスタンス」のステップ処理を実現。
- コード例:
(draw :vertex-count 12 :instance-count NUM_TREES)
- ドキュメント: インスタンス付きの木々サンプルページ
エクスポート形式:.png とその意義
バンドリングの多様性
pngine では以下の変換が可能で、.sjon ファイルから以下のいずれかへエクスポートできます:
- .png: 高速な静的用途向け。JS を読み込む部分は極めて軽量。
- .html: ブラウザ直実行用。
- .zip: アーカイブ形式。
- バイナリ生バイトコード: プレイヤー不要のコンテナ。
「png」の真意
画像が同時にもう一つのプレビュー/ポスターであり、かつバイトコードやランタイムペイロードのコンテナとなるという概念へのオマージュです。
結論:WebGPU の成長基盤
「サブストレート(基盤)」とは? 土壌のように以下の 3 つの機能を持つ存在を目指しています:
- 構造的アンカー: 根のための安定性。
- 環境維持: 水を保持しつつ酸素交換を可能にする(WebGPU の最適化)。
- 栄養供給: 栄養分を貯蔵または供給する(汎用的インタラクション、CPU/WASM コードのフック)。
pngine の役割
- WebGPU とグラフィックスのための実験と探求の基盤。
- 低レベルでの実装に焦点化されつつも、汎用的な機能を提供。
- エラーチェック・検証可能なパッケージとして提供(LSP、エディタ連携)。
- 自動生成された .png プレビュー付きでシェーダーを共有可能。
詳細は WebGPU の配線 およびコードリポジトリをご確認ください。