# ⚡ Quick API Reference SigPro is a high-performance micro-framework that updates the **Real DOM** surgically. No Virtual DOM, no unnecessary re-renders, and built-in **Cleanup** (memory cleanup). ## Core Functions Explore the reactive building blocks of SigPro.
Function Signature Description
$(val, key?) (any, string?) => Signal Creates a Signal. If key is provided, it persists in localStorage.
$(fn) (function) => Computed Creates a Computed Signal that auto-updates when dependencies change.
$watch(fn) (function) => stopFn Auto Mode: Tracks any signal touched inside. Returns a stop function.
$watch(deps, fn) (Array, function) => stopFn Explicit Mode: Only runs when signals in deps change.
$if(cond, then, else?) (Signal|bool, fn, fn?) => Node Reactive conditional. Automatically destroys "else" branch memory.
$for(src, render, key) (Signal, fn, fn) => Node Keyed Loop: Optimized list renderer. Uses the key function for surgical DOM moves.
$router(routes) (Array) => Node SPA Router: Hash-based routing with dynamic params (:id) and auto-cleanup.
$mount(node, target) (any, string|Node) => Runtime Entry point. Cleans the target and mounts the app with full lifecycle management.
--- ## Element Constructors (Tags) SigPro provides **PascalCase** wrappers for all standard HTML5 tags (e.g., `Div`, `Span`, `Button`). ### Syntax Pattern 
Tag({ attributes }, [children])
### Special Attributes & Routing

Two-way Binding

value: mySignal

Automatic sync for Input, Textarea, and Select. Updates the signal on 'input' or 'change'.

Dynamic Routing

$router.to('/user/1')

Navigate programmatically. Access params via $router.params().id.

Refs & DOM

ref: (el) => ...

Get direct access to the DOM node once it is created.

Event Handling

onClick: (e) => ...

Standard events with automatic removeEventListener on destruction.

--- > [!IMPORTANT] > **Performance Hint:** For lists (`$for`), always provide a unique key function `(item) => item.id` to prevent unnecessary node creation and enable reordering. > [!TIP] > **Performance Hint:** Always use functions `() => signal()` for dynamic children to ensure SigPro only updates the specific node and not the whole container.