SigPro
FUNCTIONAL
No strings. No templates. Pure JS function calls for instant DOM mounting.
ATOMIC
Fine‑grained signals update exactly what changes. No V‑DOM diffing overhead.
ULTRA‑THIN
Sub‑3KB runtime. Infinitely smaller bundle than React, Vue or even Svelte.
COMPILER‑FREE
Standard Vanilla JS. What you write is what the browser executes. Period.
Functional DOM Construction
SigPro replaces slow "Template Parsing" with High‑Efficiency Function Calls. While other frameworks force the browser to parse strings of HTML or execute complex JSX transformations, SigPro uses a direct functional approach.
| Feature | Standard HTML / JSX | SigPro Functional |
|---|---|---|
| Syntax | <div>Hello</div> | div("Hello") (or h('div', "Hello")) |
| Processing | Parse → Diff → Patch | Direct API Call |
| Overhead | High (V‑DOM / Parser) | Zero |
| Reactivity | Component‑wide | Atomic (Node‑level) |
Less Code, More Power
By sharing a minuscule runtime, your final application bundle is infinitely smaller.
- React/Vue: You ship a heavy orchestrator (~30‑90KB) just to say "Hello World".
- Solid/Svelte: You still depend on a compilation step that generates extra boilerplate.
- SigPro: You ship Pure Vanilla JS. The runtime is so small that it often costs less than a single high‑res icon.
Two Ways to Use SigPro
🎯 Modern ESM (recommended): Import only the functions you need – zero global pollution.
import { $, div, button, mount } from 'sigpro';
const count = $(0);
mount(() => div([ button({ onclick: () => count(count()+1) }, count) ]), '#app');🌍 Classic Global (IIFE): Load the script and everything is automatically on window – no imports needed.
<script src="https://cdn.jsdelivr.net/npm/sigpro@1.2.19/dist/sigpro.js"></script>
<script>
const count = $(0);
mount(() => div([ button({ onclick: () => count(count()+1) }, count) ]), '#app');
</script>🔧 ESM + Global injection: If you want the global helpers but still use type="module", call sigpro().
<script type="module">
import { sigpro } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
sigpro(); // now $, div, button, etc. are global
</script>Precision Engineering
1. Functional Efficiency
div(), button(), span()… These aren't just wrappers; they are pre‑optimized constructors. When you call div({ class: 'btn' }, "Click"), SigPro creates the element and attaches its reactive listeners in a single, surgical operation.
2. The "No‑Bundle" Bundle
Because SigPro is so small, it is the only engine where the more code you write, the more the efficiency gap grows. While others grow linearly with components and framework overhead, SigPro stays flat, leveraging the native power of modern browser engines.
3. Shared Runtime
All components share the same atomic engine. One signal can update a single character in a paragraph across 100 components without ever re‑evaluating the component functions themselves.
Kill the Bloat.
Stop shipping 100KB of "Framework" for 2KB of business logic. SigPro gives you the tools to build ultra‑fast, modern apps with True Vanilla Performance.