I would like to present a new concept frontend framework called NeoComp. It is a JavaScript framework that favors lightweight, simple vanilla JavaScript over the heavier, extended JavaScript used in other frameworks, while remaining both reactive and declarative.
It is heavily inspired by Solid, Lit, and Ripple. It revisits old concepts from a modern perspective, merging declarative definition with imperative flow.
Here is an example:
class Example extends Component {
constructor() {
super();
const { $temp } = this.createTop();
$temp`<div>`;
let text = this.signal('');
$temp`
1 + <input on:input=${(el) => text.value = el.value}>
= ${() => 1 + Number(text.value)}
`;
this.counter($temp, 'counter 1');
this.counter($temp, 'counter 2');
for (let i = 0; i < 10; i++)
$temp`<div>${i}</div>`;
$temp`</div>`;
this.fireInit();
}
counter ($temp, name) {
let count = this.signal(0);
$temp`<button on:click=${() => count.value++}>${name}: ${count}</button>`;
}
}
Features:
- It is vanilla JavaScript with no additional syntax.
- Markup is declared in its natural form (HTML) inside tagged templates.
- Fully reactive with deep state reactivity.
- Powered by fine-grained reactivity, with implicit bindings inferred from the templates.
- Driven by imperative construction; the structure is built once, not re-evaluated on every update.
- Uses chunked templates: templates are created in multiple parts instead of one big blob. Each section is inlined within its logic and can use normal control flow.
- Defined inside classes to maintain their own scope and to act as regular objects that can be interacted with (not abstract functions).
- Feature-full: lazy loading, async programming, independent state contexts.
- Full ownership of the DOM; no hidden internals messing with elements without permission.
NeoComp is a framework that rethinks the wheel. It uses an imperative model that remains as declarative as other frameworks, and shows that old concepts thought to be dead still have power, all while being small, powerful, and simple.
aliibrahim123•1d ago
I would like to present a new concept frontend framework called NeoComp. It is a JavaScript framework that favors lightweight, simple vanilla JavaScript over the heavier, extended JavaScript used in other frameworks, while remaining both reactive and declarative.
It is heavily inspired by Solid, Lit, and Ripple. It revisits old concepts from a modern perspective, merging declarative definition with imperative flow.
Here is an example:
Features:- It is vanilla JavaScript with no additional syntax.
- Markup is declared in its natural form (HTML) inside tagged templates.
- Fully reactive with deep state reactivity.
- Powered by fine-grained reactivity, with implicit bindings inferred from the templates.
- Driven by imperative construction; the structure is built once, not re-evaluated on every update.
- Uses chunked templates: templates are created in multiple parts instead of one big blob. Each section is inlined within its logic and can use normal control flow.
- Defined inside classes to maintain their own scope and to act as regular objects that can be interacted with (not abstract functions).
- Feature-full: lazy loading, async programming, independent state contexts.
- Full ownership of the DOM; no hidden internals messing with elements without permission.
- Lightweight: 7.5 kb gzip.
- Optional bundle-time optimization (parsing templates)
NeoComp is a framework that rethinks the wheel. It uses an imperative model that remains as declarative as other frameworks, and shows that old concepts thought to be dead still have power, all while being small, powerful, and simple.
if you are looking for more about the philosophy behind: https://aliibrahim123.github.io/recomputed/web-dev/
Looking for your feedback on this framework and its approaches.