feat: add render graph driven renderer architecture

Amp-Thread-ID: https://ampcode.com/threads/T-019f9d91-77c1-7206-a60f-ed6554ce92ab Co-authored-by: Heaust Azure <heaust.azure@gmail.com>
2026-07-27 02:53:44 +00:00
parent 8a8369706b
commit d4e8634f67
290 changed files with 48804 additions and 1995 deletions
@@ -0,0 +1,12 @@
+<!doctype html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>fxnode all supported</title>
+    <link rel="stylesheet" href="./style.css" />
+  </head>
+  <body>
+    <canvas id="graph"></canvas>
+    <script type="module" src="./main.ts"></script>
+  </body>
+</html>
@@ -0,0 +1,20 @@
+import { createApplicationFxNode } from "../application-browser.js";
+import { prepareFxNodeBrowserHost } from "../../shared/browser-host.js";
+import initialLayout from "./initialLayout.json" with { type: "json" };
+const canvas = document.querySelector("canvas")!,
+  host = prepareFxNodeBrowserHost({ canvas });
+let root: Awaited<ReturnType<typeof createApplicationFxNode>> | undefined,
+  view: Awaited<ReturnType<NonNullable<typeof root>["attachView"]>> | undefined;
+try {
+  root = await createApplicationFxNode();
+  await root.setState(initialLayout);
+  view = await root.attachView({ canvas, viewport: host.initialViewport });
+  host.attach(root, view);
+  (window as unknown as { fxnodeExample: unknown }).fxnodeExample = { root, view };
+  await view.whenRendered();
+} catch (error) {
+  host.destroy();
+  await view?.detach();
+  root?.destroy();
+  throw error;
+}
@@ -0,0 +1,13 @@
+html,
+body {
+  margin: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  background: #202124;
+}
+canvas {
+  display: block;
+  width: 100%;
+  height: 100%;
+}