SigPro
Atomic Unified Reactive Engine
"The efficiency of direct DOM manipulation with the elegance of functional reactivity."
No strings. No templates. Pure JS function calls for instant DOM mounting.
Fine‑grained signals update exactly what changes. No V‑DOM diffing overhead.
Sub‑2KB runtime. Infinitely smaller bundle than React, Vue or even Svelte.
Standard Vanilla JS. What you write is what the browser executes. Period.
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) |
By sharing a minuscule runtime, your final application bundle is infinitely smaller.
-🎯 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@1.2.19/+esm';
-sigpro(); // now $, div, button, etc. are global
-</script>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.
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.
- -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.
-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.
No strings. No templates. Pure JS function calls for instant DOM mounting.
Fine‑grained signals update exactly what changes. No V‑DOM diffing overhead.
Sub‑2KB runtime. Infinitely smaller bundle than React, Vue or even Svelte.
Standard Vanilla JS. What you write is what the browser executes. Period.
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) |
By sharing a minuscule runtime, your final application bundle is infinitely smaller.
+🎯 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@1.2.19/+esm';
+sigpro(); // now $, div, button, etc. are global
+</script>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.
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.
+ +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.
+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.