# Introduction

**Element** is a lightweight, reactive frontend framework that brings you back to the basics of Web development. Inspired by Lit and Solid, Element is built without a Virtual DOM, relying instead on JavaScript/TypeScript and a signal-based reactive system.

<figure><img src="/files/CfEy5b1INpqq8jIlzevD" alt=""><figcaption></figcaption></figure>

### Why Element?

In a world of complex frameworks with steep learning curves, Element offers a refreshing approach:

* **Back to Basics**: No Virtual DOM overhead - Just native DOM manipulation
* **Signal-based Reactivity**: Use the familiar `signal/effect` pattern
* **Lightweight**: Minimal bundle size with maximum performance
* **TypeScript First**: Built with TypeScript for better developer experience
* **Intuitive API**: Clean, readable code that's easy to understand and maintain

### Key Features

* 🔄 **Reactive System**: Fine-grained reactivity with signals and effects
* 🎯 **Native DOM Manipulation**: No Virtual DOM layer for better performance
* 🎨 **Template Literals**: HTML-like syntax using tagged template literals
* 🧩 **Built-in Components**: Conditional rendering and list components included
* 📦 **Zero Dependencies**: Lightweight and self-contained
* 🔧 **TypeScript Support**: Full type safety and excellent IDE support

#### Philosophy

Element follows the principle of **progressive enhancement**. Start with standard HTML and JavaScript, then add reactivity where needed. The framework stays out of your way while providing powerful tools for building modern Web applications.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://dmnchzl.gitbook.io/element-documentation/introduction.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.