feat: some shit

app/src/lib/runtime/helpers.ts

@@ -0,0 +1,39 @@
+export function logInt32ArrayChanges(
+  before: Int32Array,
+  after: Int32Array,
+  clamp = 10
+): void {
+  if (before.length !== after.length) {
+    throw new Error('Arrays must have the same length');
+  }
+
+  let rangeStart: number | null = null;
+  let collected: number[] = [];
+
+  const flush = (endIndex: number) => {
+    if (rangeStart === null) return;
+
+    const preview = collected.slice(0, clamp);
+    const suffix = collected.length > clamp ? '...' : '';
+
+    console.log(
+      `Change ${rangeStart}-${endIndex}: [${preview.join(', ')}${suffix}]`
+    );
+
+    rangeStart = null;
+    collected = [];
+  };
+
+  for (let i = 0; i < before.length; i++) {
+    if (before[i] !== after[i]) {
+      if (rangeStart === null) {
+        rangeStart = i;
+      }
+      collected.push(after[i]);
+    } else {
+      flush(i - 1);
+    }
+  }
+
+  flush(before.length - 1);
+}

app/src/lib/runtime/runtime-executor.ts

@@ -1,3 +1,4 @@
+import type { SettingsToStore } from '$lib/settings/app-settings.svelte';
 import { RemoteNodeRegistry } from '@nodarium/registry';
 import type {
   Graph,
@@ -13,6 +14,8 @@ import {
   encodeFloat,
   type PerformanceStore
 } from '@nodarium/utils';
+import { DevSettingsType } from '../../routes/dev/settings.svelte';
+import { logInt32ArrayChanges } from './helpers';
 import type { RuntimeNode } from './types';
 
 const log = createLogger('runtime-executor');
@@ -79,14 +82,14 @@ export type Pointer = {
 
   perf?: PerformanceStore;
 
-  constructor(
-    private readonly registry: NodeRegistry,
-    public cache?: SyncCache<Int32Array>
-  ) {
-    this.cache = undefined;
-    this.refreshView();
-    log.info('MemoryRuntimeExecutor initialized');
-  }
+   constructor(
+     private readonly registry: NodeRegistry,
+     public cache?: SyncCache<Int32Array>
+   ) {
+     this.cache = undefined;
+     this.refreshView();
+     log.info('MemoryRuntimeExecutor initialized');
+   }
 
   private refreshView(): void {
     this.memoryView = new Int32Array(this.memory.buffer);
@@ -409,10 +412,11 @@ export type Pointer = {
         const args = inputs.flatMap(p => [p.start * 4, p.end * 4]);
 
         log.info(`Executing node ${node.type}/${node.id}`);
+        const memoryBefore = this.memoryView.slice(0, this.offset);
         const bytesWritten = nodeType.execute(this.offset * 4, args);
-        if (bytesWritten === -1) {
-          throw new Error(`Failed to execute node`);
-        }
+        this.refreshView();
+        const memoryAfter = this.memoryView.slice(0, this.offset);
+        logInt32ArrayChanges(memoryBefore, memoryAfter);
         this.refreshView();
 
         const outLen = bytesWritten >> 2;
@@ -427,6 +431,7 @@ export type Pointer = {
           )
         ) {
           this.results[node.id] = inputs[0];
+          this.allPtrs.push(this.results[node.id]);
           log.info(`Node ${node.id} result reused input memory`);
         } else {
           this.results[node.id] = {
@@ -434,6 +439,7 @@ export type Pointer = {
             end: outputStart + outLen,
             _title: `${node.id} ->`
           };
+          this.allPtrs.push(this.results[node.id]);
           this.offset += outLen;
           lastNodePtr = this.results[node.id];
           log.info(
@@ -454,6 +460,7 @@ export type Pointer = {
       console.error(e);
     } finally {
       this.isRunning = false;
+      console.log('Final Memory', [...this.memoryView.slice(0, 20)]);
       this.perf?.endPoint('runtime');
       log.info('Executor state reset');
     }

app/src/routes/dev/+page.svelte

@@ -127,8 +127,14 @@
           {/each}
         </tbody>
       </table>
+      <button
+        onclick={() => copyVisibleMemory(visibleRows, ptrs, start.value)}
+        class="flex items-center cursor-pointer absolute bottom-4 left-4 z-100 bg-gray-200 px-2 py-1 rounded hover:bg-gray-300"
+      >
+        Copy Visible Memory
+      </button>
       <input
-        class="absolute bottom-4 left-4 bg-white"
+        class="absolute bottom-4 right-4 bg-white"
         bind:value={start.value}
         min="0"
         type="number"
@@ -144,6 +150,13 @@
 
 <Sidebar>
   <Panel id="general" title="General" icon="i-[tabler--settings]">
+    <h3 class="p-4 pb-0">Debug Settings</h3>
+    <NestedSettings
+      id="Debug"
+      bind:value={devSettings.value}
+      type={DevSettingsType}
+    />
+    <hr />
     <NestedSettings
       id="general"
       bind:value={appSettings.value}

app/src/routes/dev/helpers.ts

@@ -0,0 +1,48 @@
+import type { Pointer } from '$lib/runtime';
+
+export function copyVisibleMemory(rows: Int32Array, currentPtrs: Pointer[], start: number) {
+  if (!rows?.length) return;
+
+  // Build an array of rows for the table
+  const tableRows = [...rows].map((value, i) => {
+    const index = start + i;
+    const ptr = currentPtrs[i];
+    return {
+      index,
+      ptr: ptr?._title ?? '',
+      value: value
+    };
+  });
+
+  // Compute column widths
+  const indexWidth = Math.max(
+    5,
+    ...tableRows.map((r) => r.index.toString().length)
+  );
+  const ptrWidth = Math.max(
+    10,
+    ...tableRows.map((r) => r.ptr.length)
+  );
+  const valueWidth = Math.max(
+    10,
+    ...tableRows.map((r) => r.value.toString().length)
+  );
+
+  // Build header
+  let output =
+    `| ${'Index'.padEnd(indexWidth)} | ${'Ptr'.padEnd(ptrWidth)} | ${'Value'.padEnd(valueWidth)
+    } |\n`
+    + `|-${'-'.repeat(indexWidth)}-|-${'-'.repeat(ptrWidth)}-|-${'-'.repeat(valueWidth)}-|\n`;
+
+  // Add rows
+  for (const row of tableRows) {
+    output += `| ${row.index.toString().padEnd(indexWidth)} | ${row.ptr.padEnd(ptrWidth)} | ${row.value.toString().padEnd(valueWidth)
+      } |\n`;
+  }
+
+  // Copy to clipboard
+  navigator.clipboard
+    .writeText(output)
+    .then(() => console.log('Memory + metadata copied as table'))
+    .catch((err) => console.error('Failed to copy memory:', err));
+}

app/src/routes/dev/settings.svelte.ts

@@ -0,0 +1,15 @@
+import { localState } from '$lib/helpers/localState.svelte';
+import { settingsToStore } from '$lib/settings/app-settings.svelte';
+
+export const DevSettingsType = {
+  debugNode: {
+    type: 'boolean',
+    label: 'Debug Nodes',
+    value: true
+  }
+} as const;
+
+export let devSettings = localState(
+  'dev-settings',
+  settingsToStore(DevSettingsType)
+);