Getting Started

Levelo JS is a lightweight, ultra-fast reactive JavaScript framework built for speed and simplicity. No Virtual DOM. Direct Real DOM. Powered by Motion Mind.

Using CLI (Recommended)

Scaffold a complete Levelo JS project instantly:

npx create-levelo-app my-app
cd my-app
npm install
npm run dev

Manual Installation

Add Levelo JS to an existing project:

npm install levelojs

Quick Start

import { render } from 'levelojs';
import Mind from './Mind.jsx';

render(Mind, document.getElementById('app'));

import { state } from 'levelojs';

function Counter() {
  const [count, setCount] = state(0);

  return (
    <div>
      <h2>{count()}</h2>
      <button onclick={() => setCount(count() + 1)}>
        Level Up ➔
      </button>
    </div>
  );
}

export default Counter;

Features

• No Virtual DOM — Direct Real DOM updates, zero reconciliation overhead
• Ultra Lightweight — Minimal footprint, maximum performance
• Fine-grained Reactivity — Only what changes, updates
• JSX Support — Familiar developer experience
• Vite-powered — Instant HMR and fast builds

Core API

| API | Description | |---|---| | state | Reactive state primitive | | effect | Reactive side effects | | computed | Derived reactive values | | head | Document metadata management | | render | Mount component to DOM | | h | Real DOM element factory (internal) |

Packages

| Package | Description | Version | |---|---|---| | levelojs | Core framework library | | | create-levelo-app | Official project scaffolding CLI | |

License

This project is licensed under the MIT License © Motion Mind.