Core Concepts

Element is built around three core concepts that work together to create reactive user interfaces:

1. Signals

Signals are the foundation of Element's reactivity system. They store state and notify subscribers when values change.

const [count, setCount] = createSignal(0);

2. Effects

Effects are functions that automatically re-execute when their dependencies change.

createEffect(() => {
  console.log("Count:", count());
});

3. Templates

Templates use tagged template literals to create reactive DOM elements that update automatically.

const template = html`<div>Count: ${count}</div>`;