zouloux / reflex

Reflex is a tiny and fast reactive UI library.

Reflex

Reflex is a tiny and fast reactive UI library.

• 🦋 Super lightweight and 0 dependency, about min-zipped
• 🏎 Highly performant diffing algorithm ( Proof )
• 🔋 Batteries included with factory extensions
• ⚛️ Truly reactive, states are Signals by design
• 🔍 Fine grained DOM updates for even better performances, components are rendered only when needed
• 🤓 Typed JSX
• 🍰 Easy to learn
• 🤘️ HMR Support for Vite

---

Quick example

# Install with npm
npm i reflex-dom

import { h, render, state } from 'reflex-dom';
export function App (props) {
  const counter = state(0);
  const increment = () => counter.value++;
  const reset = () => counter.value = 0;
  return () => <div>
    <h1>Hello from {props.name} 👋</h1>
    <button onClick={increment}>Increment</button>&nbsp;
    <button onClick={reset}>Reset</button>&nbsp;
    <span>Counter : {counter}</span>
  </div>
}
render( <App name="Reflex" />, document.body );

---

🎮 - Play with this example on StackBlitz

👨‍🏫 - Learn Reflex in 5 minutes

📘 - See API documentation