Ampandheaust
d34722d66d
Amp-Thread-ID: https://ampcode.com/threads/T-01a01380-b478-77d0-84a0-102880a5c5ae Co-authored-by: Heaust Azure <heaust.azure@gmail.com>
79 lines
2.3 KiB
Markdown
79 lines
2.3 KiB
Markdown
# Render graph frontends
|
|
|
|
Every frontend ends at `@yawn/render-graph-ast`. Choose the authoring style that fits your tooling; the worker receives the same S-expression either way.
|
|
|
|
## Plain-object authoring
|
|
|
|
`graphFromObject` validates and freezes ordinary JavaScript data. Pipeline declarations, compute dispatches, nodes, and DAG references all become canonical AST fields.
|
|
|
|
```js
|
|
import { graphFromObject } from "@yawn/render-graph-js";
|
|
|
|
const graph = graphFromObject({
|
|
id: "main",
|
|
revision: 1,
|
|
pipelines: { render: [scenePipeline], compute: [preparePipeline] },
|
|
nodes: [
|
|
{
|
|
id: "mesh",
|
|
state: "enabled",
|
|
executor: { key: "mesh", version: 2 },
|
|
parameters: {},
|
|
inputs: {},
|
|
},
|
|
],
|
|
});
|
|
```
|
|
|
|
<Playground
|
|
id="jso-graph"
|
|
title="A complete JSO graph"
|
|
description="The playground compiles a plain object through AST serialization and activates the returned loadout."
|
|
/>
|
|
|
|
## Fluent authoring
|
|
|
|
Use `RenderGraph` when a small mutable builder makes generated graphs easier to read. Calling `ast()` is the immutable boundary.
|
|
|
|
```js
|
|
import { RenderGraph, ref } from "@yawn/render-graph-js";
|
|
|
|
const graph = new RenderGraph("generated", 1)
|
|
.renderPipeline(scenePipeline)
|
|
.node("source", "mesh", { version: 2 })
|
|
.node("draw", "scene", {
|
|
version: 2,
|
|
inputs: { mesh: [ref("source", "mesh")] },
|
|
});
|
|
|
|
const compiled = await graph.load(core);
|
|
```
|
|
|
|
## FXNode export
|
|
|
|
`@yawn/render-graph-fxnode` translates editor snapshots into the same AST. It owns editor catalog versions and diagnostic mapping; no FXNode shape crosses into core.
|
|
|
|
```js
|
|
import { adaptFxNodeSnapshot } from "@yawn/render-graph-fxnode";
|
|
|
|
const ast = adaptFxNodeSnapshot(snapshot, revision, {
|
|
pipelines: myPipelines,
|
|
});
|
|
```
|
|
|
|
Open the <a href="/render-graph-studio/">Render Graph Studio</a> to edit an FXNode graph, compile it beside the JSO preset, and switch prepared loadouts.
|
|
|
|
## DAG references
|
|
|
|
A reference is data, not a nested expression. Point several consumers at one output to represent fan-out without repeating the source node.
|
|
|
|
```js
|
|
import { reference } from "@yawn/render-graph-ast";
|
|
|
|
const shared = reference("sceneColor", "texture");
|
|
left.inputs.color = [shared];
|
|
right.inputs.color = [shared];
|
|
```
|
|
|
|
The serializer emits `(ref "sceneColor" "texture")` wherever that edge is consumed.
|