feat: some tweaks

app/src/lib/graph-interface/graph-manager.ts

@@ -11,6 +11,8 @@ const logger = createLogger("graph-manager");
 
 logger.mute();
 
+const clone = "structuredClone" in self ? self.structuredClone : (args: any) => JSON.parse(JSON.stringify(args));
+
 function areSocketsCompatible(output: string | undefined, inputs: string | string[] | undefined) {
   if (Array.isArray(inputs) && output) {
     return inputs.includes(output);
@@ -67,7 +69,7 @@ export class GraphManager extends EventEmitter<{ "save": Graph, "result": any, "
     const serialized = { id: this.graph.id, settings: this.settings, nodes, edges };
     logger.groupEnd();
 
-    return serialized;
+    return clone(serialized);
   }
 
 

app/src/lib/helpers/index.ts

@@ -155,3 +155,55 @@ export function humanizeDuration(durationInMilliseconds: number) {
 
   return durationString.trim();
 }
+export function debounceAsyncFunction<T extends any[], R>(func: (...args: T) => Promise<R>): (...args: T) => Promise<R> {
+  let currentPromise: Promise<R> | null = null;
+  let nextArgs: T | null = null;
+  let resolveNext: ((result: R) => void) | null = null;
+
+  const debouncedFunction = async (...args: T): Promise<R> => {
+    if (currentPromise) {
+      // Store the latest arguments and create a new promise to resolve them later
+      nextArgs = args;
+      return new Promise<R>((resolve) => {
+        resolveNext = resolve;
+      });
+    } else {
+      // Execute the function immediately
+      try {
+        currentPromise = func(...args);
+        const result = await currentPromise;
+        return result;
+      } finally {
+        currentPromise = null;
+        // If there are stored arguments, call the function again with the latest arguments
+        if (nextArgs) {
+          const argsToUse = nextArgs;
+          const resolver = resolveNext;
+          nextArgs = null;
+          resolveNext = null;
+          resolver!(await debouncedFunction(...argsToUse));
+        }
+      }
+    }
+  };
+
+  return debouncedFunction;
+}
+
+export function withArgsChangeOnly<T extends any[], R>(func: (...args: T) => R): (...args: T) => R {
+  let lastArgs: T | undefined = undefined;
+  let lastResult: R;
+
+  return (...args: T): R => {
+    // Check if arguments are the same as last call
+    if (lastArgs && args.length === lastArgs.length && args.every((val, index) => val === lastArgs?.[index])) {
+      return lastResult; // Return cached result if arguments haven't changed
+    }
+
+    // Call the function with new arguments
+    lastResult = func(...args);
+    lastArgs = args; // Update stored arguments
+    return lastResult; // Return new result
+  };
+}
+

app/src/lib/node-store/DraggableNode.svelte

@@ -4,8 +4,6 @@
 
   export let node: NodeDefinition;
 
-  $: console.log({ node });
-
   let dragging = false;
 
   let nodeData = {

app/src/lib/performance/PerformanceViewer.svelte

@@ -176,7 +176,7 @@
   }
 </script>
 
-{#key $activeType}
+{#key $activeType && data}
   {#if $activeType === "cache-hit"}
     <Monitor
       title="Cache Hits"
@@ -191,9 +191,8 @@
       points={constructPoints($activeType)}
     />
   {/if}
-{/key}
 
-<div class="p-4 performance-tabler">
+  <div class="p-4 performance-tabler">
     <div class="flex items-center gap-2">
       <Checkbox id="show-total" bind:value={showAverage} />
       <label for="show-total">Show Average</label>
@@ -218,7 +217,9 @@
               on:click={() => ($activeType = "total")}
             >
               total<span
-              >({Math.floor(1000 / getTotalPerformance(showAverage))}fps)</span
+                >({Math.floor(
+                  1000 / getTotalPerformance(showAverage),
+                )}fps)</span
               >
             </td>
           </tr>
@@ -305,7 +306,8 @@
     {:else}
       <p>No runs available</p>
     {/if}
-</div>
+  </div>
+{/key}
 
 <style>
   h3 {

app/src/lib/settings/panels/ExportSettings.svelte

@@ -1,37 +1,36 @@
 <script lang="ts">
-  import type { Scene } from "three";
-  import { OBJExporter } from "three/addons/exporters/OBJExporter.js";
-  import { GLTFExporter } from "three/addons/exporters/GLTFExporter.js";
+  import type { Group } from "three";
+  import type { OBJExporter } from "three/addons/exporters/OBJExporter.js";
+  import type { GLTFExporter } from "three/addons/exporters/GLTFExporter.js";
   import FileSaver from "file-saver";
 
   // Download
   const download = (
-    data: string,
+    data: ArrayBuffer | string,
     name: string,
     mimetype: string,
     extension: string,
   ) => {
-    if (typeof data !== "string") data = JSON.stringify(data);
     const blob = new Blob([data], { type: mimetype + ";charset=utf-8" });
     FileSaver.saveAs(blob, name + "." + extension);
   };
 
-  // export const json = (data, name = 'default') => {
-  //   download(JSON.stringify(data), name, 'application/json', 'json');
-  // };
-  //
-  // export const obj = (data, name = 'default') => {
-  // };
+  export let scene: Group;
 
-  export let scene: Scene;
+  let gltfExporter: GLTFExporter;
+  async function exportGltf() {
+    const exporter =
+      gltfExporter ||
+      (await import("three/addons/exporters/GLTFExporter.js").then((m) => {
+        gltfExporter = new m.GLTFExporter();
+        return gltfExporter;
+      }));
 
-  function exportGltf() {
-    const exporter = new GLTFExporter();
     exporter.parse(
       scene,
       (gltf) => {
         // download .gltf file
-        download(gltf, "plant", "text/plain", "gltf");
+        download(gltf as ArrayBuffer, "plant", "text/plain", "gltf");
       },
       (err) => {
         console.log(err);
@@ -39,8 +38,15 @@
     );
   }
 
-  function exportObj() {
-    const exporter = new OBJExporter();
+  let objExporter: OBJExporter;
+
+  async function exportObj() {
+    const exporter =
+      objExporter ||
+      (await import("three/addons/exporters/OBJExporter.js").then((m) => {
+        objExporter = new m.OBJExporter();
+        return objExporter;
+      }));
     const result = exporter.parse(scene);
     // download .obj file
     download(result, "plant", "text/plain", "obj");

app/src/routes/+page.svelte

@@ -19,7 +19,7 @@
   import GraphSettings from "$lib/settings/panels/GraphSettings.svelte";
   import NestedSettings from "$lib/settings/panels/NestedSettings.svelte";
   import { createPerformanceStore } from "$lib/performance";
-  import type { Scene } from "three";
+  import type { Group, Scene } from "three";
   import ExportSettings from "$lib/settings/panels/ExportSettings.svelte";
   import {
     MemoryRuntimeCache,
@@ -28,6 +28,7 @@
   import { IndexDBCache } from "$lib/node-registry-cache";
   import { decodeNestedArray, fastHashString } from "@nodes/utils";
   import BenchmarkPanel from "$lib/settings/panels/BenchmarkPanel.svelte";
+  import { debounceAsyncFunction, withArgsChangeOnly } from "$lib/helpers";
 
   let performanceStore = createPerformanceStore("page");
 
@@ -53,7 +54,7 @@
   $: runtime = $AppSettings.useWorker ? workerRuntime : memoryRuntime;
 
   let activeNode: Node | undefined;
-  let scene: Scene;
+  let scene: Group;
   let updateViewerResult: (result: Int32Array) => void;
 
   let graph = localStorage.getItem("graph")
@@ -69,8 +70,7 @@
   async function randomGenerate() {
     const g = manager.serialize();
     const s = { ...$graphSettings, randomSeed: true };
-    const res = await handleResult(g, s);
-    return res;
+    await handleUpdate(g, s);
   }
 
   let keymap: ReturnType<typeof createKeyMap>;
@@ -84,35 +84,12 @@
   let graphSettings = writable<Record<string, any>>({});
   let graphSettingTypes = {};
 
-  let isWorking = false;
-
-  let unfinished:
-    | {
-        graph: Graph;
-        settings: Record<string, any>;
-        hash: number;
-      }
-    | undefined;
-
-  async function handleResult(_graph: Graph, _settings: Record<string, any>) {
-    if (!_settings) return;
-    if ($managerStatus !== "idle") return;
-    const inputHash = fastHashString(
-      JSON.stringify(_graph) + JSON.stringify(_settings),
-    );
-    if (isWorking) {
-      unfinished = {
-        graph: _graph,
-        settings: _settings,
-        hash: inputHash,
-      };
-      return false;
-    }
-    isWorking = true;
+  const handleUpdate = debounceAsyncFunction(
+    async (g: Graph, s: Record<string, any>) => {
       performanceStore.startRun();
       try {
         let a = performance.now();
-      const graphResult = await runtime.execute(_graph, _settings);
+        const graphResult = await runtime.execute(g, s);
         let b = performance.now();
 
         if ($AppSettings.useWorker) {
@@ -134,21 +111,9 @@
         console.log("errors", error);
       } finally {
         performanceStore.stopRun();
-      isWorking = false;
-    }
-
-    if (unfinished && unfinished.hash === inputHash) {
-      let d = unfinished;
-      unfinished = undefined;
-      await handleResult(d.graph, d.settings);
-    }
-
-    return true;
-  }
-
-  $: if ($managerStatus === "idle") {
-    handleResult(manager.serialize(), $graphSettings);
       }
+    },
+  );
 
   $: if (AppSettings) {
     //@ts-ignore
@@ -203,7 +168,7 @@
           bind:showHelp={$AppSettings.showHelp}
           bind:settings={graphSettings}
           bind:settingTypes={graphSettingTypes}
-          on:result={(ev) => handleResult(ev.detail, $graphSettings)}
+          on:result={(ev) => handleUpdate(ev.detail, $graphSettings)}
           on:save={handleSave}
         />
         <Settings>

nodes/max/plantarium/rotate/src/input.json

@@ -17,13 +17,6 @@
       "options": ["x", "y", "z"],
       "description": "Along which axis should we rotate?"
     },
-    "spread": {
-      "type": "boolean",
-      "internal": true,
-      "hidden": true,
-      "value": true,
-      "description": "If multiple objects are connected, should we rotate them as one or spread them?"
-    },
     "angle": {
       "type": "float",
       "min": 0,
@@ -31,6 +24,13 @@
       "step": 0.05,
       "value": 0,
       "description": "Rotation angle"
+    },
+    "spread": {
+      "type": "boolean",
+      "internal": true,
+      "hidden": true,
+      "value": true,
+      "description": "If multiple objects are connected, should we rotate them as one or spread them?"
     }
   }
 }

nodes/max/plantarium/rotate/src/lib.rs

@@ -18,8 +18,7 @@ pub fn execute(input: &[i32]) -> Vec<i32> {
 
     let plants = split_args(args[0]);
     let axis = evaluate_int(args[1]); // 0 =x, 1 = y, 2 = z
-    let spread = evaluate_int(args[2]);
-    let angle = evaluate_float(args[3]);
+    let spread = evaluate_int(args[3]);
 
     let output: Vec<Vec<i32>> = plants
         .iter()
@@ -34,7 +33,7 @@ pub fn execute(input: &[i32]) -> Vec<i32> {
 
             let path = wrap_path_mut(&mut path_data);
 
-            let length = path.get_length() as f64;
+            let angle = evaluate_float(args[2]);
 
             let origin = [path.points[0], path.points[1], path.points[2]];