WebGPULocal AIJavaScriptCanvasRapid Build

Experimental Resource Logic Engine

Overview

Built in a single 180-minute sprint, this browser-based logic engine uses local WebGPU inference and HTML5 Canvas to map out freeform text into dynamic supply/demand nodes.

By parsing inputs like "I have 5 cookies" or "I need 3 cookies", the engine normalizes quantities, categorizes resources, and flags supply shortages dynamically on a canvas visual grid.

Interactive Demo

Run the engine live directly in your browser:

Build Notes & Challenges

Sprint Start

Initial goal: Convert raw text input into expandability diagrams. Started with a scrollable canvas UI base before hooking up input handling.

Scope Pivot

Recognized sentence parsing was too broad. Pivoted focus toward limited resource allocation and supply/demand mapping to give the engine a concrete purpose.

Local AI & Edge Cases

Integrated a local WebGPU-backed SLM parser to handle freeform sentences. Running on-device required battling normalization edge cases:

  • Subject Over-generalization: Sentences starting with "The" misclassifying subject nodes (Fixed).
  • Vague Quantity Terms: Resolving terms like "lots of" or "plenty" into numeric representations (Fixed).
  • Spelled Numbers & Colloquialisms: Mapping "One" or "Dozen", plus phrases like "We actually have 1 battery in the warehouse" (Fixed).
  • English Pluralization: Handling irregular stem mutations like cookies → cooky.
180 Min Wrap-up

Grid canvas layout established. While deeper relational logic (prepositional clauses like "cookie for a friend") would require true graph relational mapping, the 3-hour prototype successfully performs real-time supply/demand extraction and shortage detection.

Key Takeaways

  • On-Device SLMs: Great for fast local extraction, but edge-case normalization (like English pluralization rules) will test your patience.
  • Fallback Systems: Building deterministic fallbacks behind local AI models is essential for structured graph outputs.
  • Relational Depth: Prepositional logic requires true relational graph mapping, not just flat string extraction.