Actualizar Readme.md
This commit is contained in:
22
Readme.md
22
Readme.md
@@ -1,3 +1,5 @@
|
|||||||
|
Ultra-lightweight rendering engine designed for extreme performance.
|
||||||
|
|
||||||
# `SigPro` ⚛️
|
# `SigPro` ⚛️
|
||||||
|
|
||||||
[](https://www.npmjs.com/package/sigpro)
|
[](https://www.npmjs.com/package/sigpro)
|
||||||
@@ -5,10 +7,6 @@
|
|||||||
[](https://github.com/natxocc/sigpro)
|
[](https://github.com/natxocc/sigpro)
|
||||||
[](https://github.com/natxocc/sigpro/blob/main/LICENSE)
|
[](https://github.com/natxocc/sigpro/blob/main/LICENSE)
|
||||||
|
|
||||||
### **The Atomic Reactivity Engine for the Modern Web.**
|
|
||||||
|
|
||||||
**SigPro** is an ultra-lightweight rendering engine designed for extreme performance. By eliminating the Virtual DOM and heavy compilers, it achieves **surgical reactivity** in less than 2KB.
|
|
||||||
|
|
||||||
[**Explore the Docs →**](https://natxocc.github.io/sigpro/) | [**View on GitHub**](https://github.com/natxocc/sigpro)
|
[**Explore the Docs →**](https://natxocc.github.io/sigpro/) | [**View on GitHub**](https://github.com/natxocc/sigpro)
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -65,6 +63,9 @@ Create reactive, persistent components with a syntax that feels like Vanilla JS,
|
|||||||
```
|
```
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
|
import { sigpro } from "sigpro";
|
||||||
|
sigpro(); // All functions and tags are available in window
|
||||||
|
|
||||||
const Counter = () => {
|
const Counter = () => {
|
||||||
// Simple signal
|
// Simple signal
|
||||||
const value = $(100);
|
const value = $(100);
|
||||||
@@ -74,14 +75,14 @@ const Counter = () => {
|
|||||||
const doubleValue = $(()=> value() * count());
|
const doubleValue = $(()=> value() * count());
|
||||||
|
|
||||||
// Create fast HTML with pure JS
|
// Create fast HTML with pure JS
|
||||||
return Div({ class: "card" }, [
|
return div({ class: "card" }, [
|
||||||
H1(`Count: ${count()}, Reference: ${value()}, Double x Ref: ${doubleValue()}`),
|
h1(() => `Count: ${count()}, Reference: ${value()}, Double x Ref: ${doubleValue()}`),
|
||||||
P("Atomic updates. Zero re-renders of the parent tree."),
|
p("Atomic updates. Zero re-renders of the parent tree."),
|
||||||
Button({ onclick: () => count(c => c + 1)}, "Increment +1")
|
button({ onclick: () => count(c => c + 1)}, "Increment +1")
|
||||||
]);
|
]);
|
||||||
};
|
};
|
||||||
|
|
||||||
Mount(Counter, "#app");
|
mount(Counter, "#app");
|
||||||
```
|
```
|
||||||
|
|
||||||
-----
|
-----
|
||||||
@@ -90,7 +91,7 @@ Mount(Counter, "#app");
|
|||||||
|
|
||||||
| Feature | **SigPro** | React / Vue | Svelte |
|
| Feature | **SigPro** | React / Vue | Svelte |
|
||||||
| :--- | :--- | :--- | :--- |
|
| :--- | :--- | :--- | :--- |
|
||||||
| **Payload (Gzipped)** | **< 1.8KB** | ~30KB - 50KB | ~5KB (Compiled Runtime) |
|
| **Payload (Gzipped)** | **~3KB** | ~30KB - 50KB | ~5KB (Compiled Runtime) |
|
||||||
| **State Logic** | **Atomic Signals** | Virtual DOM Diffing | Compiler Dirty Bits |
|
| **State Logic** | **Atomic Signals** | Virtual DOM Diffing | Compiler Dirty Bits |
|
||||||
| **Update Speed** | **Direct Node Access** | Component Re-render | Block Reconciliation |
|
| **Update Speed** | **Direct Node Access** | Component Re-render | Block Reconciliation |
|
||||||
| **Native Persistence** | **Included ($)** | Requires Plugins | Manual |
|
| **Native Persistence** | **Included ($)** | Requires Plugins | Manual |
|
||||||
@@ -99,6 +100,7 @@ Mount(Counter, "#app");
|
|||||||
| **Routing** | **Reactive Hash (Router) + File-based (Vite)** | Virtual Router (External) | File-based / External |
|
| **Routing** | **Reactive Hash (Router) + File-based (Vite)** | Virtual Router (External) | File-based / External |
|
||||||
| **Learning Curve** | **Zero (Vanilla JS)** | Steep (JSX/Templates) | Medium (Directives) |
|
| **Learning Curve** | **Zero (Vanilla JS)** | Steep (JSX/Templates) | Medium (Directives) |
|
||||||
|
|
||||||
|
**~3KB** with full functions, less than **1KB** with minimal tree shaking
|
||||||
-----
|
-----
|
||||||
|
|
||||||
## Scalable Architecture with Vite
|
## Scalable Architecture with Vite
|
||||||
|
|||||||
Reference in New Issue
Block a user