Effortless UIs with Reactive Precision.

Solid is a modern JavaScript framework for today's web.

Get startedJoin the community
Counter.jsx
import { createSignal } from "solid-js";

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

	return (
		<button
		  onClick={() => setCount((n) => n + 1)}
		>
		  Count: {count()}
		</button>
	);
}

Overview

Solid is a modern JavaScript framework designed to build responsive and high-performing user interfaces (UI). It prioritizes a simple and predictable development experience, making it a great choice for developers of all skill levels.

What is Solid?

As a JavaScript framework, Solid embraces reactivity and fine-grained updates.

Reactivity, in programming, refers to an applications' ability to respond to changes in data or user interactions.

Traditionally, when a change occurs, the entire web page would need to reload to display the updated information. In contrast, when using a fine-grained reactive system, updates are only applied to the parts of the page that need to be updated.

Solid adopts the concept of fine-grained reactivity, updating only when the data the application depends on changes. This decreases work and can result in faster load times and a smoother user experience overall.

Advantages of using Solid

  • Performant: Fine-grained reactivity allows Solid to update only what has changed, resulting in faster load times and smoother performance overall.

  • Powerful: Using less memory and processing power, Solid is capable of creating complex applications without compromising on functionality. This also gives developers the flexibility over how and when updates happen.

  • Pragmatic: Rather than sticking to rigid structures or methods, Solid provides the freedom to choose the strategies and practices that work best for you.

  • Productive: Regardless of experience level, Solid's clear and predictable API makes developers' work simpler and more efficient.

Solid aims to strike a balance between speed, efficiency, power, and flexibility, all while providing a developer-friendly environment. This combination of features makes it a great choice to build responsive and high-performing UIs.

Quick links

Tutorial

Learn the basics of Solid through this interactive tutorial.

Templates

Start your first project with a template that fits your needs.

Ecosystem

Explore the Solid ecosystem and find useful tools and libraries.

Contribute

Help improve Solid by contributing to the documentation.

Find our API documentation under the Reference tab

Join the Solid community on Discord to share your projects or get help from our community!

Edit this page Report an issue with this page